Expanding Menu | JavaScriptSource

Expanding Menu

Travis Beckham Feb 17, 2006
This is a simple expanding menu. The anchor tags that expand each menu are added by JavaScript, so the HTML code doesn't contain any event handlers or unnecessary HTML tags. The structure of the menu is defined with unordered and ordered lists elements.

The JavaScript Source: Navigation : Expanding Menu

Simply click inside the window below, use your cursor to highlight the script, and copy [Control]+C the script into a new file in your text editor (such as Note Pad) and save [Control+S]. The script is yours!!!

Did you use this script?  Do you like this site?  Please link to us!

Leave a Response


hi ,, thanx for the code its work with me but how i can modify this code to be multi levels rather than one level , i need this code to be expanded for 4 levels and thanx again

sara May 12, 2012

Thanks for the script![br /][br /]Any way to keep the menu expanded when a sub is clicked and the page changes?

Teri Apr 8, 2009

Rich,[br /][br /]you can fix that by changing the css,[br /][br /]in the menu style:[br /][br /] width: 100px;[br /][br /][br /][br /]either just delete the width or adjust to what you need

Shana Apr 8, 2009

Good day,[br /][br /]I was able to use the code for my navigation needs so thank you.[br /][br /]The only issue I am having is figuring out how to adjust the length of the menu header and the menu sub headers. I'm very new to js and could use some guidence.[br /][br /]How do I make each line longer so it wont wrap to the next line. Here's an exapmle of a title I'm using, "Abbreviations Used in this Manual".[br /][br /]Currently, it comes out like this:[br /][br /]Abbreviations[br /] Used in this[br /] Manual[br /][br /]Thanks

Rich Heyn Dec 15, 2008