• Structure of the menu goes away from DIVs to TABLE (So it performs better with Netscape and Linux browsers)
• System of OnMouseOver effects is completely changed and simplified
• Main Menu functions are separated from html files
• Simplier User Settings

This script will help you shorten the process of building a website with text-based navigation, especially when you don't know in front exactly how the menu will look like (or which items it will have).

We all know it: At the end of the development, client will change his mind and tells you to change 'About Us' menu item to 'About Me'. It's okay if you are using database, but if not, you are in trouble. Changing one word in 100 html files isn't so easy (especially if they are already on server). Use this script to build your menus and you're out of trouble.

With this script you can:

• Store all menu items in ONE file using only JavaScript
• Change it's visual appearance with changing few style classes
• Have 2 levels of submenus (with little knowledge of JavaScript you can add support for unlimited levels!!!)
• Easily change order of menu items
• Based on document position in hierarchy highlight menu item as Active
• Easily customize menu parameters
• Be sure it works on 4.x and higher browsers (Even MSIE 3.x supports it)

However there are some things which you Cannot Do:

• You can't organize HTML files in folders. All HTML files must be in same folder (If you are using relative paths)
• It's not recommended to use this script for Image based menus.

Files:
index.html | item_1.html | item_2.html | item_3.html - sample files
dyn_menu.js - dynamic menu functions
menu_array.js - stores menu items
menu_styles.css - defines style sheets for menu

Installation:
Place menu_styles.css, dyn_menu.js and menu_array.js to same folder as other HTML files. Edit index.html in any text editor (eg. Notepad, EditPlus) and Copy (CTRL + C) all between theese comments (<!-- Dynamic Menu Start --> and <!-- Dynamic Menu End-->) and Paste it (CTRL + V) to your HTML files on the position where you want to have menu.

To HEAD section of your HTML files add theese two lines of code:

<LINK REL="stylesheet" href="menu_styles.css" type="text/css">
<SCRIPT LANGUAGE="JavaScript" src="menu_array.js"></SCRIPT>
<SCRIPT LANGUAGE="JavaScript" src="dyn_menu.js"></SCRIPT>

Now Edit the menu_array.js to build your own custom menu. In menuitem Array define Menu Items, in menuhref Array define hyperlinks for Menu Items.

In your HTML files follow the comments in script to set document position and Active Menu Items.

Okay, you just saw what this script can do. Do you think that you can make it better? DO SO!!! And please share your new improved version of this script with us at wyktor.com. We'll be happy to include your name at our website as co-author. Just let us know at wyktor@seznam.cz

Do you use this script on your page? Let us know about it and we'll post your link on this page. Mail us at wyktor@seznam.cz

Author: Wyktor (wyktor@seznam.cz)
Current Version: 1.5
Date of Last Release: 21/Aug/2002
Date of Creation: 2001
Copyright: Wyktor (wyktor@seznam.cz)
License: Free, Open Source