Sets up a system of multilevel popup menus on a page. Features include:
- Easy array-based setup of menus.
- Menus automatically written to document by constructor function.
- Relative positioning of menus - taken from trigger position on the fly.
- This means you can move the root menu, and
all the others will follow.
- You can choose whether or not to make the first level menu yourself.
- Popup exit timer so triggers and menus don't have to overlap each other.
- Adjustable height and spacing for each item.
- Customisable colours for each menu - background, border and hover.
- Each menu's text can have its own style associated e.g. Reopen menu above.
- Near unlimited hierarchial menus (popouts).
- Automatically shows only one hierarchy at a time (like Windows' menus).
- Items automatically highlight through hierarchy back to root menu.
- Small code - 5kb with comments removed, plus menu definitions.
You'll definitely want to trim out most of the comments, to speed load time. Please
leave a link to my site in there somewhere - that's where I'll keep the most recent
commented version. Also, try to employ a better sense of colour than I've used in this
demonstration :)
Compatibility:
- Developed and tested in IE5.
- Fix for IE4 from v1.0 has been implemented, so it should work there.
- Tested and works in NS4, but erratic behaviour depending on how you arrange the code.
I recommend placing all code in an external .JS source file, that is what my site uses.
This is due to NS4 disliking the writing of many layer tags using document.write(), and
I intend completely rewriting the menu generation portion of the script. Be sure to test
pages created with this menu script thoroughly in Netscape 4.
- Netscape 6 / Gecko browsers untested but treated as IE4/5 and should work.
Version History:
- v1.1:
- Added support for stylesheets for each individual menu.
- Split the item height to table height and spacing, more reliable that way
- Fixed bug in IE4 when menus weren't stretched properly. The fix was to change a zero
to a three halfway through the code :).
- Updated comments and extended example slightly.
- Tidied up internal operation a little bit, should display faster now.
- v1.0: