Web www.gerd-tentler.de
Version 2.1 (released Jan. 10, 2007) [Download]

Usage

First, insert this line into your HTML body where you want the menu to appear:
<script type="text/javascript" src="treemenu.js"></script>
Then create a new instance of the TREEMENU class:
var menu = new TREEMENU();
If you want to open all folders at start (completely open tree), use this syntax instead:
var menu = new TREEMENU(true);
By the way, you can create as many menus as you want.

Now insert your menu items (level, text, [URL], [target], [JavaScript]):
menu.entry(1, "item 1", "page1.htm", "parent.main");
menu.entry(2, "item 1.1", "page1-1.htm", "blank");
menu.entry(2, "item 1.2", "", "", "alert('You clicked menu item 1.2')");
...
level  is the horizontal position of the item within the tree structure. Example:
- item 1            level 1
- - item 1.1        level 2
- - item 1.2        level 2
- - - item 1.2.1    level 3
- - - item 1.2.2    level 3
- - item 1.3        level 2
- item 2            level 1
text  is the item name.
URL  is the web address of for instance another page where you want the item to link to. This argument is optional.
target  can be another window (e.g. "blank", "myPopup") or, if you are using framesets, the target frame (e.g. "parent.main", "top.myFrame"). This argument is optional, but note that if you set URL without a target, the window or frame containing the tree-menu will be the target!
JavaScript  can contain any JavaScript code that will be executed when the item is clicked. This argument is optional.

Finally, adapt the configuration to your needs and create the menu:
menu.floating = true;
menu.width = 200;
menu.bgColor = "#F0F0F0";
menu.itemWrap = true;
menu.itemBold = true;
...
menu.create();
Please have a look at the script (configuration section) for more detailed information.

Inside your HTML code, you can also use the function jumpTo() to link menu items externally. Example:
<a href="javascript:menu.jumpTo(1, 3, 2, 1)">Go to menu item 1.3.2.1</a>
It's also possible to open or close the complete tree-menu with the functions open() and close(). Example:
<a href="javascript:menu.open()">open all</a>
<a href="javascript:menu.close()">close all</a>
Hint: You should have a look at the source code of the introduction section to see how tree-menus are created. ;-)

Comments