Template: Free Javascript Simple Tree Menu

Html Tree Menu Vista Style 4

The template emulates Vista OS menu style. To open submenus click on menu items.
The appearence of this template is determined by the following parameters:

    - The menu have XP Style; Animation effect for subitems
    - Toggle-mode support.
    - Items have icons
    - Menu has a static position and is placed within the table cell

Key features:

    - Inactive/Disabled items
    - Unlimited number of sub levels
    - Personal CSS styles for separate menu elements
    - Items with icons
    - Vertical orientation of the Tree Menu
    - 3-state icons for each item
    - Submenus expand/collapse on mouseover
    - Image arrows

Menu Screenshots Free Javascript Simple Tree Menu

Buy Now! :: Free Trial Download :: More Info

Features Free Javascript Simple Tree Menu

Compatibility

Full cross-browser compatibility including IE, Netscape, Mozilla, Opera, Firefox, Konqueror and Safari on Windows, Mac OS and Linux
Menu can be populated from a database using ASP, PHP, etc.
Search engine friendly
Support for any doctypes
Fits for secure sites

Seamless Integration

Visible over flash, select boxes, iframes, java applets
Multiple menus on the same page
Amicable to other scripts and css styles
Any HTML code can be used inside menu items

Horizontal Scroll Tree Free Javascript Simple Tree Menu

High Performance

AJAX menu loading - loads web menu data from the server "on-the-fly".
Commonly loads quicker than other html page elements
Runs well with an unlimited number of submenus and items

Easy Setup

De Luxe Tuner. GUI interface to create your free javascript simple tree menu menus easily and in no time
Sensible menu parameters for manual editing

Professional Look-n-feel

Entirely customizable look-n-feel
A lot of pre-designed free javascript simple tree menu samples
Hundreds of visual effects
Custom CSS styles can be applied for all menu settings

Buy Now! :: Free Trial Download :: More Info

Javascript Tree Menu. Expandable Menu.

You can animation and effects for the javascript tree menu. These effects will make your menu more attractive and stylish. When you click on titles of submenus - submenus will collapse or expand. Submenus have a fade effect in Internet Explorer when you collapse/expand them, so your menus look like original menus in Windows XP Explorer. You can set different speed for an animation.

Buy Now! :: Free Trial Download :: More Info

Recent Questions Free Javascript Simple Tree Menu

Q: I figure I'm missing something basic ....

I've created a simple horizontal menu and uploaded the various files to to my website go generate the bar food menu

How do I add content to each tab rollovers so that the content will appear on this same page (as opposed to having to move to another page)?

i.e. when you click on starters, you see the starter below,
when you click on mains you see the mains below
etc. etc.

I'm new to this .....

A: You should paste your content in the <div> .. </div> tags.

<div id="content1" style=" visibility: hidden;" class="tabPage">
<br><br><br>
<p align=center><img src="img/logo_DM.gif" width=262 height=56 alt="Deluxe-Menu.com"></p>
</div>

<div id="content2" style="visibility: hidden;" class="tabPage">
<br><br><br>
<p align=center><img src="img/logo_DT.gif" width=262 height=56 alt="Deluxe-Tree.com"></p>

</div>

<div id="content3" style=" visibility: hidden;" class="tabPage">
<br><br><br>
<p align=center><img src="img/logo_DTabs.gif" width=254 height=58 alt="Deluxe-Tabs.com"></p>
</div>

See in Deluxe Tabs there are two modes:

1.   var tabMode=0;
You can create only one level of tabs and assign Object Id's of theDIV's to show when you click on the tab rollovers.

["XP Tab 1","content1", "", "", "", "", "", "", "", ],
["XP Tab 2","content2", "", "", "", "", "", "", "", ],
["XP Tab 3","content3", "", "", "", "", "", "", "", ],
["XP Tab 4","content4", "", "", "", "", "", "", "", ],

2.   var tabMode=1;
You can assign only links in this mode.
You should create top level items with subitems.

["XP Tab 1","", "", "", "", "", "", "", "", ],
    ["|Link 1_1","http://deluxe-tabs.com", "", "", "", "", "0", "", "", ],
    ["|Link 1_2","testlink.htm", "", "", "", "", "0", "", "", ],
    ["|Link 1_3","testlink.htm", "", "", "", "", "0", "", "", ],
    ["|Link 1_4","testlink.htm", "", "", "", "", "0", "", "", ],
    ["|Link 1_5","testlink.htm", "", "", "", "", "0", "", "", ],
["XP Tab 2","", "", "", "", "", "", "", "", ],
    ["|Link 2_1","testlink.htm", "", "", "", "", "0", "", "", ],
    ["|Link 2_2","testlink.htm", "", "", "", "", "0", "", "", ],
    ["|Link 2_3","testlink.htm", "", "", "", "", "0", "", "", ],
    ["|Link 2_4","testlink.htm", "", "", "", "", "0", "", "", ],
    ["|Link 2_5","testlink.htm", "", "", "", "", "0", "", "", ],
["XP Tab 3","", "", "", "", "", "", "", "", ],
    ["|Link 3_1","testlink.htm", "", "", "", "", "0", "", "", ],
    ["|Link 3_2","testlink.htm", "", "", "", "", "0", "", "", ],
    ["|Link 3_3","testlink.htm", "", "", "", "", "0", "", "", ],
    ["|Link 3_4","testlink.htm", "", "", "", "", "0", "", "", ],
    ["|Link 3_5","testlink.htm", "", "", "", "", "0", "", "", ],

You can use Object ID as well as Link in both modes. Use the following prefixes within item's link field:
"object:" - means that there is object id after it;
"link:" - means that there is a link after it.
"javascript:" - means that there is a javascript code after it, for example:javascript:alert(\'Hello!\')

So, you should write for example:

["|Link 1_1","object:Content1_1", "", "", "", "", "0", "", "", ],

Q: In my previous email asking about your menu program's ability to display a different color word on a menu item when the site is on that selected page, I made a mistake - I was experimenting with Vista xp1 style, the black/blue shiny dhtml menu templates.

A: The menu has only two states normal and mouseover. We'll try to add the pressed state in the future.

You can set a pressed item using Javascript API:

function dm_ext_setPressedItem (menuInd, submenuInd, itemInd, recursion)

Sets a current pressed item.
menuInd - index of a menu on a page, >= 0.
submenuInd - index of a submenu, >= 0.
itemInd - index of an item, >=0.
recursion = true/false - highlight parent items.

But notice, to use dm_ext_setPressedItem() you should know ID of selected item and subitem.
You can't get this ID after you reload your page. That is why you should write your own code on PHP.

Q: Google Chrome - javascript menu js are obscured by Flash.

A: See more info about this problem on our website:

http://www.deluxe-menu.com/objects-overlapping-sample.html

Q: Can I put two popup windows in one HTML file?
One popup for example after 1 second, and disappear after 10
The second one after 15 second and disappear after 30 seconds.
Can you help me?

A: You should set the following parameters for the first window:

winID:"window1",
openAfter:1,
closeAfter:10,

for the second window:

winID:"window2",
openAfter:15,
closeAfter:30,

See also how should you install popup windows on your page:

<head>


<noscript><a href="http://deluxepopupwindow.com">DHTML Window Script by DeluxePopupWindow.com</a></noscript>
<script type="text/javascript"> var dmWorkPath="deluxe-popup-window.files/";</script>
<script type="text/javascript" src="deluxe-popup-window.files/dpopupwindow.js"></script>


</head>

<body bgcolor="#FFFFFF">
<script type="text/javascript" src="deluxe-popup-window.js"></script>
<script type="text/javascript" src="deluxe-popup-window2.js"></script>
</body>

Buy Now! :: Free Trial Download :: More Info