Javascript Tree Menu by

DHTML Tree:   XP Style Orange
      State Saving Collapse Menu

version 3.3

  • XP-Style
    This sample has XP-style.
    You can create both standard or XP-like types of collapse menu.

  • Animation and Effects
    - Click on titles of sub menus - sub menus will collapse or expand.
    - Sub menus have a fade effect in IE when you collapse/expand them,
       so your menus look like original menus in Windows XP Explorer.
    - You can set different speed for animation (parameter: var tXPIterations)

  • State Saving collapse menu
    DHTML Tree can save items state automatically!
    There is no need to write additional code on a server side to remember what items were expanded/collapsed.
    Set the following parameter:

    var tsaveState = 1;

    and the tree menu remembers its structure for each user who visit your page.
    Try to expand/collapse items. Then reload the page and you'll see results.

  • Default Expanded/Collapsed Items
    You can set default expanded/collapsed items and sub menus.
    Add '+' symbol before a text of the item if you want the item will be expanded by default.
    For example:

    ["+My Item"]

    To expand all items in the menu by default set the following parameter:

    var texpanded = 1;
View data-file of this sample


          Standart Web Tree Menu
          XP Style Silver
          XP Style Blue  
          XP Style Olive  
          XP Style Green  
          XP Style Orange  
          XP Style Red