View Full Version : Need a little help with Bullet List Accordion Menu

08-23-2010, 09:00 AM
Script: Bullet List Accordion Menu

I'm using the above and it's all working fine, but there's something that it doesn't do and I'm wondering whether it's possible to amend the script at all?
Obviously if you click on any of the buttons, they expand so show the sub list, but I'd like to know if it's possible for the buttons to have their own page as well as the expanding menu.
So for example, if I was to click on CSS Library, it would reveal the sub menu underneath, but also have it's own page from that button?

I did try the following:

<h3 class="menuheader expandable"><a href="a_page.html">CSS Library</a></h3>
<ul class="categoryitems">
<li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C1/">Horizontal CSS Menus</a></li>
<li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C2/">Vertical CSS Menus</a></li>
<li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C4/">Image CSS</a></li>
<li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C6/">Form CSS</a></li>
<li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C5/">DIVs and containers</a></li>
<li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C7/">Links & Buttons</a></li>
<li><a href="http://www.dynamicdrive.com/style/csslibrary/category/C8/">Other</a></li>
<li><a href="http://www.dynamicdrive.com/style/csslibrary/all/">Browse All</a></li>

But it didn't work - I knew it wouldn't be that easy!

I hope I'm explaining myself clearly!
Any help would be greatly apreciated, thank you.
Kerstey :)

08-24-2010, 02:44 AM
If I understood your question correctly, you want the header when clicked on to not only expand a sub menu, but also go to the URL defined inside the header's A tag? If so, simply specify "clickgo" for the initialization code's "revealtype" option, for example:

ddaccordion.init({ //top level headers initialization
headerclass: "expandable", //Shared CSS class name of headers group that are expandable
contentclass: "categoryitems", //Shared CSS class name of contents group
revealtype: "clickgo", //Reveal content when user clicks or onmouseover the header? Valid value: "click", "clickgo", or "mouseover"
mouseoverdelay: 200, //if revealtype="mouseover", set delay in milliseconds before header expands onMouseover
collapseprev: true, //Collapse previous content (so only one open at any time)? true/false
defaultexpanded: [0], //index of content(s) open by default [index1, index2, etc]. [] denotes no content
onemustopen: false, //Specify whether at least one header should be open always (so never all headers closed)
animatedefault: false, //Should contents open by default be animated into view?
persiststate: true, //persist state of opened contents within browser session?
toggleclass: ["", "openheader"], //Two CSS classes to be applied to the header when it's collapsed and expanded, respectively ["class1", "class2"]
togglehtml: ["prefix", "", ""], //Additional HTML added to the header when it's collapsed and expanded, respectively ["position", "html1", "html2"] (see docs)
animatespeed: "fast", //speed of animation: integer in milliseconds (ie: 200), or keywords "fast", "normal", or "slow"
oninit:function(headers, expandedindices){ //custom code to run when headers have initalized
//do nothing
onopenclose:function(header, index, state, isuseractivated){ //custom code to run whenever a header is opened or closed
//do nothing

See the script page (http://www.dynamicdrive.com/dynamicindex17/ddaccordion.htm) and this example (http://www.dynamicdrive.com/dynamicindex17/ddaccordionmenu-arrow.htm) for more info on this setting.

08-25-2010, 08:05 AM
That's great, thank you.

There just seems to be a little thing though where if I click on a sub menu item and then back on to the 'parent' link, it only collapses the menu and doesn't open the url that it's linked to until it is clicked on again?

08-26-2010, 06:37 AM
The current behavior is such that clicking on the header will navigate to a URL only if it's expanding the sub menu, and not when the sub menu is already expanded and header is contracting it instead. Are you asking how to have it both ways?