Glossy Menu Customization Issue

[pr75]

1) Script Title: Glossy Menu

2) Script URL (on DD): [URL="http://www.dynamicdrive.com/dynamicindex17/ddaccordionmenu-glossy.htm[/URL]

3) Describe problem: I would like to close headers with submenus when I click one level headers. If I click on The Team it shows sub-options but if I click on Home, sub-options stay open.

http://www.neophite.com/paulo/tnmicroendo

Thanks for the help in advance!!!

[jscheuer1]

Instead of relying upon the persiststate: true property to keep an item open when going from page to page, set that to false.

Instead you can either use the defaultexpanded property and/or the URL parameter method.

[pr75]

Thank you John for the fast response. Could you please elaborate on "defaultexpanded property and/or the URL parameter method"? I changed the persistant state to false, works great, but I would like the submenu to stay open while I'm on a section with sub-options and close that menu when I'm clicking on an one level menu item. Again, thank you!!!

[jscheuer1]

OK, when you click on an expanded item, you are going to a different page. On that page you may set the default expanded to whatever index is required for example:

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: [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: false, //persist state of opened contents within browser session?
	toggleclass: ["", ""], //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 initalized
		//do nothing
	},
	onopenclose:function(header, index, state, isuseractivated){ //custom code to run whenever a header is opened or closed
		//do nothing
	}
})

Would open the first one. that would be good on bio.html and staff.html

Or skip that and use the url parameter. Everywhere you have:

<div class="submenu">
	<ul>
	<li><a href="bio.html?submenuheader=0">Dr. Sam Alborz</a></li>
	<li><a href="staff.html?submenuheader=0">The Staff</a></li>
	</ul>
</div>

add the highlighted.

Whichever method you use the number 0 refers to the the first sub menu. 1 would refer to the second , and so on.

The url parameter overrides everything, the cookie (if you revert to persistate: true) overrides the defaultexpanded, which is only used if neither of the other two are.

So you could actually mix and match all three, but I think it's simplest to use only the default exapanded. Your URL's will look cleaner and avoiding cookies is good. Some people disable them, and they can persist in odd ways causing unexpected results sometimes, at least during testing.

[pr75]

Thank you John! You really saved the day!Perfect!