Class: xPandMenu

This class lets you create an hierarchic menu based on a list of menu items and submenu items (parents and children).

The generated menu can expand and collapse menu dynamically, that is when the user clicks on a menu item, all corresponding submenu items are shown (or hidden if already visible).

A good example of what it looks like is the list of documents and directories in the left frame of the Microsoft Windows Explorer.

The use of the class is fairly easy. Simply add parents and children elements in the same order you would like to see them in the menu. Then let the class generate the code for you.

The HTML code generated is only based on <DIV> tags and is compatible with all browsers.

The generated menu is fully customizable using CSS. You may write your own CSS style definitions to configure the look and feel of parents and children menu items'.

The class also lets you define an image to use as the expand and collapse box. This is optional but can be handy to make the menu easier to understand.

How to use the class, demo file

How to use the class, demo file, windows style

Class file