View Full Version : Accordion Script with Responsive Headers Help

01-01-2009, 08:34 PM
1) Script Title: Glossy Accordion Menu with responsive headers

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

3) Describe problem:
I'd like to make the headers that can open and collapse act just like the menu headers that don't have submenus. In otherwords, when I click on a menu to expand it, I really want to open a new html page with the appropriate content for that menu header, along with the menu being expanded.

The example shows how to kind of do this by loading new content into an iframe (which I can duplicate via the onint() and onopenclose() event handlers), however I want to just use the href attribute to open a new page which shows the change of content and the expanded or collapse menu. Is there a way to indicate that action in the onopenclose() event?

Also, I can properly activate the menu items when clicking if I set the revealtype to mouseover, but I find it really distracting to keep having then menu items expand & contract upon mouseover, so I'd prefer a little more challenging approach to accomplish by clicking the menu header.

Thanks and Happy New Year!

01-01-2009, 10:18 PM
I don't know if this (http://www.dynamicdrive.com/forums/showthread.php?t=30128) thread is explained enough.. But see if you understand it.

01-01-2009, 10:46 PM
Hi, I did see that post when searching and I understand that solution, but I have a slightly different request. First, I am not even using the +/- little symbols on the menu header. Second, I would like to expand the submenu upon the first click while also displaying content that to the right of the menu that is pertinent to the header that was clicked.

Thanks for the responses and help...

01-01-2009, 10:55 PM
I would not suggest an iframe. They're not widely supported..

01-01-2009, 11:13 PM
I agree! I am merely trying to change the display to the right of the menu to provide the user information about that header section (it's actually a jpg image with text), so that's why I thought of just opening a new page.

This post (http://www.dynamicdrive.com/forums/showthread.php?t=33741) is the closest I've seen describing the problem and someone saying they came up with a solution, but it doesn't provide enough info for me.


01-02-2009, 05:23 PM
Thanks for accepting an additional post but I have searched extensively in the forums to try to find out how to solve this.

I have uploaded my current state to our server so you can see:

**Please Click Here** (http://dariabishop.com/2009_Website/weddings.html)

We would really like to have specific header content come up in the box to the right of the menu (by opening up the appropriate page) If you click on Contact Us (a non-expandable menu item) you will see what I mean.

if interested, the following links go to the appropriate pages I'd like to have connected to the menu headers, while also expanding the menu:
Love Stories (http://dariabishop.com/2009_Website/lovestories.html)
Info (http://dariabishop.com/2009_Website/info.html)
Clients (http://dariabishop.com/2009_Website/clients.html)

Thanks so much

01-04-2009, 10:46 AM
The question of having each header not only expand sub content, but also act as a link itself has come up many times on the forums already actually. By default the script will disable any link in the header if it's set to expand onClick (versus onMouseover). This is just a sensible design choice IMO, but if you want to override this, inside the .js file, comment out the following line (via the code in red):

// return false //cancel default click behavior

A more reasonable approach IMO would be to just change the reveal type of the headers to onMouseover. See this thread: http://www.dynamicdrive.com/forums/showthread.php?t=33741

01-08-2009, 07:29 PM
thanks ddadmin for your excellent help! THe script is awesome (and I agree with you that the mouseover is a terrific design feature). It's just that I wanted to display new content for each new header.