View Full Version : Accordion header anchor link work while header is expanded

05-10-2012, 03:34 AM
This is a question on accordion behavior. If this is the wrong forum, then where?

If an accordion header is expanded and one of its submenu item's pages is active (web site is on that page), when I click the expanded header, nothing happens. The client wants to go to the header's linked page. The header link only works when it needs to expand also (with clickgo).

Is there a way to make the accordion header's link work even when it is already expanded?


05-10-2012, 06:39 AM
Warning: Please include a link to the DD script in question in your post, in this case, http://www.dynamicdrive.com/dynamicindex17/ddaccordion.htm . See this thread (http://www.dynamicdrive.com/forums/showthread.php?t=6) for the proper posting format when asking a question.

Try the below modified .js file, which should do that. The only requirement is that you have the option "onemustopen" inside the initialization code set to true, such as:

headerclass: "menuheaders", //Shared CSS class name of headers group
contentclass: "menucontents", //Shared CSS class name of contents group
revealtype: "clickgo", //Reveal content when user clicks or onmouseover the header? Valid value: "click", 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: true, //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: ["unselected", "selected"], //Two CSS classes to be applied to the header when it's collapsed and expanded, respectively ["class1", "class2"]
togglehtml: ["none", "", ""], //Additional HTML added to the header when it's collapsed and expanded, respectively ["position", "html1", "html2"] (see docs)
animatespeed: 500, //speed of animation: integer in milliseconds (ie: 200), or keywords "fast", "normal", or "slow"
oninit:function(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

When this setting is set to false, the script needs to collapse the header when it's expanded and then clicked on again, leaving no room for an additional action that is to take the user to the header's target URL. When this setting is set to true, there is no dual action to contend with.

05-10-2012, 01:45 PM
I do have onemustopen set to true. The only difference I have in settings is I have no toggleclass classes set.

Anything else I can check?


05-10-2012, 07:11 PM
Did you use the attached .js file above? If so and it still doesn't work, please post a link to your site.