Inside Technique : DHTML Vertical Menus
By Scott Isaacs

The examples in this article can only be viewed with Internet Explorer 4.0 or later.

The original vertical menu script was written by Pete Lyons. He leveraged the code from our Menu Toolkit to create a vertical menu bar. In this update, Pete's original code is cleaned up to be much smaller and more robust.

The new script makes better use of functions, removes hard-coded restrictions on how to define menus, and fixes the positioning problems that appeared in IE5 due to a change in how IE5 handles positioning. You can see the vertical menus in action to the left (none of the links are active) or visit the Washington State web-site for a real-world scenario.

The Files

Just like the menu toolkit, the menus are generated by using a combination of HTML tables, Cascading Style Sheet code and JavaScript syntax. The 3 files that work in tandem to accomplish this are:

1. ie4menus.htm
2. styles.css
3. menus.js

These files and the support images are available for download in a single zip file. Next, we take you through each of the files starting with how to build a menu.

© 1997-2000 InsideDHTML.com, LLC. All rights reserved.