jQuery Vertical nav question

[geoffb]

Hi all,

Is it possible to create a vertical menu with 4 top level links, and 2 submenu's under each, when page is loaded all the sub menu's are closed, then on hover over any of the top level links the sub menu under slides open, but (and this is where I am stuck) I also need the top level menu's to be clickable and take the user to that page...rather than just a handle for an animation be it a click or mouseover ect.

Many thanks
geoffb

[rocknbil]

Anything is possible. :-) Structure these as a series of nested UL's

<ul> 
 <li>Top menu 1 
 <ul> 
 <li>Sub menu 1.1</li> 
 <li>Sub menu 1.2</li> 
 <li>Sub menu 1.3</li> 
 </ul></li> 
 <li>Top menu 2</li> 
 <li>Top menu 3 
 <ul> 
 <li>Sub menu 3.1</li> 
 <li>Sub menu 3.2</li> 
 <li>Sub menu 3.3</li> 
 </ul></li> 
</ul> 

This will do most of the "heavy lifting" for you, positioning the nested ul's in the right places. You'd set them as hidden initially,

#nav ul li ul { display:none; }

Then on hover of the anchors (note I've left out the anchors for simplicity, you'll have to add them) a few bits of Javascript will set their display to block.

Let's see what (minified) code you've started with.

[daveVk]

a few bits of Javascript will set their display to block

or maybe

#nav ul li:hover ul { display:block; }

will suffice ?