itsbc
itsbc

Reputation: 530

On Click Toggles Submenu

I've done quite a bit of searching, but haven't been able to find exactly what I'm looking for. I'm trying to achieve an effect to where when the Parent menu item is clicked, a div containing a submenu with links relative to that parent item is dropped down and displayed. I've created an example here to give an idea:

http://jsfiddle.net/itsbc/WeL6j/1/

However, I don't want the grey div - #9e9e9e '#div' - to be covered. I understand the reason for this is because I've set the content position to fixed, however if I take off the position attribute, the submenus show up below their respective parent; opposed to being positioned all the way to the left.

Thanks in advance for any help, Bc.

Upvotes: 0

Views: 1676

Answers (3)

Michael Wheeler
Michael Wheeler

Reputation: 660

Is http://jsfiddle.net/WeL6j/7/ what you wanted to do? If so, I think it is easiest to place the hidden divs below the nav bar, where they should be displayed. Then just hide/display as neccessary

Upvotes: 1

Kane Cohen
Kane Cohen

Reputation: 1800

Seems like you're looking for a a functionality similar to jQuery tabs. Check collapsible option: http://jqueryui.com/demos/tabs/#collapsible

You'll have to extend it a bit so that content slides down instead of showing up: example:

http://jsfiddle.net/s6m7E/4/

Upvotes: 2

Nick McCormack
Nick McCormack

Reputation: 530

You may want to try toggle, a jQuery method: http://api.jquery.com/toggle/

Upvotes: 2

Related Questions