Page is a not externally linkable
- Code, Content, and Presentation
-- JavaScript and AJAX
---- jQuery Vertical nav question


rocknbil - 5:21 pm on Dec 8, 2011 (gmt 0)


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.


Thread source:: http://www.webmasterworld.com/javascript/4395528.htm
Brought to you by WebmasterWorld: http://www.webmasterworld.com