Glossy Accordion Menu Header issues.

[newsong80]

1) Script Title: Glossy Accordion Menu

2) Script URL (on DD): http://www.dynamicdrive.com/dynamici...enu-glossy.htm

3) Describe problem: I'm sorry if this has been asked/answered before. I am very "green" when it comes to scripts so answer as plainly as possible please. My needs are these: 1. Header, when clicked on stays in "down" stage image and not roll back to "up" state. 2. Header, when click does NOT go anywhere. It just expands the menu.

Here is my example: http://www.alloccasionsbridal.com/aob/aob_menu.html

I would appreciate any help. Remember, keep it simple. Thanks!

[ddadmin]

Try changing the code in red inside your initialization code below to "click":

ddaccordion.init({
	headerclass: "submenuheader", //Shared CSS class name of headers group
	contentclass: "submenu", //Shared CSS class name of contents group
	revealtype: "click", //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: [], //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: ["class1", "class2"], //Two CSS classes to be applied to the header when it's collapsed and expanded, respectively ["class1", "class2"]
	togglehtml: ["suffix", "<img src='plus.gif' class='statusicon' />", "<img src='minus.gif' class='statusicon' />"], //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 initialized
 for (var i=0; i<expandedindices.length; i++){
  var expandedindex=expandedindices[i] //index of current expanded header index within array
  headers[expandedindex].style.backgroundColor='black'
  headers[expandedindex].style.color='white'
 }
}
})

Please see the "Set Up Information" on the main script page for the various options and their possible values.

[newsong80]

Changing to "click" didn't fix it.

[ddadmin]

I don't see the change added to your page online. Can you do that so I can check it out?

[newsong80]

I'm sorry. I forgot to upload it. I just looked locally. It is done now.

[ddadmin]

The menu no longer reloads/goes to another page now when I expand a header. Is this the case for you?

[newsong80]

No, it doesn't. Thank you. One more thing I need. I need the rollover/header to stay in the down state when it is selected.

[ddadmin]

No, it doesn't. Thank you. One more thing I need. I need the rollover/header to stay in the down state when it is selected.

In the initialization code, there is an option to specify two CSS classes that are applied to the menu headers depending on their state:

	toggleclass: ["class1", "class2"], //Two CSS classes to be applied to the header when it's collapsed and expanded, respectively ["class1", "class2"]

Try styling "class2" with the styles for the rollover effect, and "class1" with the default styles for the header (so the rollover effect is reset when the header is collapsed.

Take a look at bullet list menu for an example of this.