Sample Menu Tree Style by Deluxe-Tree.com
Sample Menu Tree Style


Buy Now!  Free Trial Download

Menu Screenshots Sample Menu Tree Style

Sample Menu Tree Style Javascript Tree Hover

Features Sample Menu Tree Style

Unrivalled Features
  • Scrollable, dragable, floating
  • Unique Java Script API for altering menu "on-the-fly", without page reloading
  • AJAX technology - loads menu data from the server "on-fly and on-demand".
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
Tree Create Menu Sample Menu Tree Style
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 sample menu tree style menus easily and in no time
  • Sensible menu parameters for manual editing
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
Buy Now!  Free Trial Download

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.

Recent Questions Sample Menu Tree Style

Q: If need to make changes do I need to replace all the files and folder and script in all the web pages? Or are there just one or two files that need to be replaced? Which files or folders?


A: You need to change only your data.js (by default) file. It is thefile with your menu parameters.
Then you should upload this file on your server and may be add somenew images. That is all.


Q: Can I use data from a SQL server using ASP for the dhtml xml menu?

A: You may generate a menu from a database or XML using any server-side script, e.g., PHP, ASP, VB, etc.However, these scripts don't work inside of Javascript .js files, so, you should move parameters of a menu from a .js file into an html-page, e.g.:

<!-- JavaScript Tree Menu -->
<noscript><a href="http://deluxe-menu.com">Javascript Menu by Deluxe-Menu.com</a></noscript>
<script type="text/javascript">  var dmWorkPath = "menudir/";</script>
<script type="text/javascript" src="menudir/dmenu.js"></script>
<!-- (c) 2006, http://deluxe-menu.com -->

<script type="text/javascript" language="JavaScript1.2">
// and describe parameters of a menu
  var parameter1=value1;
  var parameter2=value2;
etc.

  var menuItems = [
// here you generate items using server-side scripts (php, asp, vb, etc.)
];
</script>

Unfortunately we don't have examples with ASP and SQL.
The example of the menu working with PHP/MYSQL you can find here:
http://deluxe-menu.com/rq-loading-bar-MySQL-support.html



Q: I downloaded the free trial version and so far it looks like we can do everything. I have a couple questions:

the designer wants it so that when any of the submenu choice are selected, the main main menu in java item should be highlighted when the submenu page is displayed (kind of a breadcrumb). So, is there any way to change the background image of one of the main menu items after the menu loads? I haven't tried running my main menu in java in a webpage yet so I'm not sure if you generate a separate CSS file or put all of the settings into a STYLE= attribute of each tag.

A: The main menu in java has only two states normal and mouseover.

Try to do the following things:

- delete   var pressedItem=1; parameter from your data file
- set correct parameter on each page before you call data file, forexample:

<noscript><a href="http://deluxe-menu.com">Javascript Menu by Deluxe-Menu.com</a></noscript>
<script type="text/javascript">  var dmWorkPath = "menudir/";</script>
<script type="text/javascript" src="menudir/dmenu.js"></script>
<script type="text/javascript">  var pressedItem=3;</script>
...
<script type="text/javascript" src="menudir/data.js"></script>

You can also 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: I am trying to create a tab menu and I have some questions.
I want each tab in a hover tab menu has a different image,
the normal and hover state uses the same image and the selected state uses a different image.




A: If you want to use different images you should use Individual Item Styles and assign them for your tabs.

  var bstyles = [

["bitemBackImage=deluxe-tabs.files/style04_n_back.gif,deluxe-tabs.files/style04_s_back.gif,deluxe-tabs.files/style04_s_back.gif",
"bbeforeItemImage=deluxe-tabs.files/style04_n_left.gif,deluxe-tabs.files/style04_s_left.gif,deluxe-tabs.files/style04_s_left.gif",
"bafterItemImage=deluxe-tabs.files/style04_n_right.gif,deluxe-tabs.files/style04_s_right.gif,deluxe-tabs.files/style04_s_right.gif"],

["bitemBackImage=deluxe-tabs.files/style04_2_n_back.gif,deluxe-tabs.files/style04_2_s_back.gif,deluxe-tabs.files/style04_2_s_back.gif",
"bbeforeItemImage=deluxe-tabs.files/style04_2_n_left.gif,deluxe-tabs.files/style04_2_s_left.gif,deluxe-tabs.files/style04_2_s_left.gif",
"bafterItemImage=deluxe-tabs.files/style04_2_n_right.gif,deluxe-tabs.files/style04_2_s_right.gif,deluxe-tabs.files/style04_2_s_right.gif"],

["bitemBackImage=deluxe-tabs.files/style04_3_n_back.gif,deluxe-tabs.files/style04_3_s_back.gif,deluxe-tabs.files/style04_3_s_back.gif",
"bbeforeItemImage=deluxe-tabs.files/style04_3_n_left.gif,deluxe-tabs.files/style04_3_s_left.gif,deluxe-tabs.files/style04_3_s_left.gif",
"bafterItemImage=deluxe-tabs.files/style04_3_n_right.gif,deluxe-tabs.files/style04_3_s_right.gif,deluxe-tabs.files/style04_3_s_right.gif"],
];

  var bmenuItems = [

["Item 1","", "", "", "", "", "0", "", "", ], //style1
["Item 2","", "", "", "", "", "1", "", "", ], //style2
["Item 3","", "", "", "", "", "2", "", "", ], //style3
];