Example #1

Example #2

Introduction

Use this script to create Explorer-like tree-menus (see examples on the left). It was tested with the following operating systems and browsers:

Windows XP:Internet Explorer 6, Netscape Navigator 7, Opera 7, Firefox 1
Mac OS X:Internet Explorer 5, Safari 1

If you use another browser or operating system, this script may not work for you - sorry.

Usage

First, insert this line into your HTML-body where you want the menu to appear: 
<script language="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')");
...
target can be another window (e.g. "blank", "myPopup") or, if you are using framesets, the target frame (e.g. "parent.main", "top.myFrame"). Please note: if you set URL without a target, the window or frame containing the tree-menu will be the target!

Finally, adapt the configuration to your needs and create the menu: 
menu.width = 200;
menu.bgColor = "#F0F0F0";
menu.itemWrap = true;
menu.itemBold = true;
...
menu.create();
Inside your HTML code, you can also use the function jumpTo() to link menu items externally. Example:

Go to menu item 1.3.2.1 
<a href="javascript:menu.jumpTo(1, 3, 2, 1)">Go to menu item 1.3.2.1</a>
Please have a look at the script (configuration section) for more detailed information. It's also a good idea to view the source code of this page. ;-)