Javatree With Jquery by Deluxe-Tree.com
Javatree With Jquery


Buy Now!  Free Trial Download

Menu Screenshots Javatree With Jquery

Javatree With Jquery Horizontal Tree Drop Down Menu

Features Javatree With Jquery

Cost Effective
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
Menu Bar Tree Javatree With Jquery
Easy Setup
  • De Luxe Tuner. GUI interface to create your javatree with jquery menus easily and in no time
  • Sensible menu parameters for manual editing
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
Professional Look-n-feel
  • Entirely customizable look-n-feel
  • A lot of pre-designed javatree with jquery samples
  • Hundreds of visual effects
  • Custom CSS styles can be applied for all menu settings
Buy Now!  Free Trial Download

Javascript Tree Menu. Expandable Menu.

  • You can create 3-state icons for each item: normal state, mouseover state, expanded state.
  • Use images for icons, backgrounds of submenus and items.
  • You can use with any amount of menu and submenus on one page.
  • Insert any HTML code inside the menu item - be it a form or a picture, a flash-object or a text. This ability allows you to create various menus of any complexity.

Recent Questions Javatree With Jquery

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

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

<div id="content1" style=" visibility: hidden;" class="tabPage">
<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">
<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">
<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 the
DIV's to show when you click on the tab.

["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: Drop down menus I have created with your product DHTML Tuner don't look too good in FireFox... is there something I can do different or do you have a newer/better solution that would work for both IE and FireFox?

A: And what exact problems do you have in Firefox? Actually JavaScript Tree Menu works fine inFirefox. But notice that filters and transitional effect are supported by IE5.5.5+ only.

http://deluxe-menu.com/filters-and-effects-sample.html


Q: Hi there ... a while ago I had asked you what I need to change to prevent exit pops from being activated, but I don't think it's working.

For example, a regular link that I want:

onClick="exit=false"

How do I do it with dhtml vertical menu?

Before, in the "text" box in the "Item Parameters" window, you had me do the following:

<span onClick='exit=false;'>click here</span>

But that doesn't seem to work. Any other suggestions? Thanks very much.

A: I suppose that you should move menuItems from the data file to yourhtml page directly (where you define exit variable).

<script>

menuItenms = [
...
],
</script>



Q: With the new version, my body onload function is blocked.
In our application we do something with a body onload function.
It doesn't get called if I use the deluxe-menu. If I remove deluxe-menu js files from html, it works.

Is there a way I can use deluxe-menu and get my onload handler called?


A: JavaScript Tree Menu detects any user's onload events and remember them in the case when you write a such events before dm_init(); call.

Try to delete onload event from <body> and write the following at theend of a page (after dm_init() call):

<script type="text/javascript"> onload = onloadHandler;</script>

That should work.