Results 1 to 3 of 3

Thread: accordian script - collapsing menus

  1. #1
    Join Date
    Jan 2009
    Posts
    2
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default accordian script - collapsing menus

    1) Script Title: Accordian Script

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

    I have been using the glossy accordian menu. I have some menu items that have submenus and some that don't. When I open a menu item with a submenu and then open a second, the first one closes - as it should. However if the second menu item I select doesn't have a submenu, the first one doesn't close.
    I can get around this by changing the persiststate: true, to persiststate: false, but then the submenus don't remain open when I am in a submenu page.

    Can anyone help?

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,496
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    As an alternative to persistence, with persistence set to false, you may set the defaultexpanded property for the sub-pages:

    Code:
    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" 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: ["", ""], //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
    	}
    })
    Use a number there, ex:

    Code:
    defaultexpanded: [0], //index of content(s) open by default [index1, index2, etc] [] denotes no content
    would be the first, 1 would be the second, and so on. You may even list more than one, separated by a comma in order to expand more than one:

    Code:
    defaultexpanded: [1,2], //index of content(s) open by default [index1, index2, etc] [] denotes no content
    OR you may use the URL parameter in your link(s) to any page to cause it to open a selected item, ex:

    Code:
    href="index.htm?mypets=2"
    where mypets is the headerclass of the menu and 2 is the number of the item to expand.
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. The Following User Says Thank You to jscheuer1 For This Useful Post:

    HelenLF (01-04-2009)

  4. #3
    Join Date
    Jan 2009
    Posts
    2
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Default

    Brilliant, thanks John. This solved it.

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •