This demo shows how the W3C Document Object Model can be used to create an expanding family tree. The script is compatible with Internet Explorer 5 and Netscape 6, with only three lines of cross-browser scripting. It is not compatible with Netscape 4.

Clicking on a box will expand the level beneath. The script has up to 10 levels; in this demo data has been entered in only the first five. Although presented here as a Family Tree the script can be used for any type of folding-tree menu.

Three images are used by this script - open_book.gif, closed_book.gif and null_book.gif. The latter is transparent, of the same dimensions as the former, and is there simply for spacing. They can be saved directly from the screen by right-clicking with the mouse.

Javascripts Page | Home