Rails Dhtmlxtree by Deluxe-Tree.com
Rails Dhtmlxtree


Buy Now!  Free Trial Download

Menu Screenshots Rails Dhtmlxtree

Rails Dhtmlxtree Tree Menu Mouse Over

Features Rails Dhtmlxtree

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

Javascript Tree Menu. Expandable Menu.

  • Apply any font of any color, size and font decoration you need. Use any available type, color and thickness of a menu. Choose any color for submenus and items backgrounds.
  • Set the size of the menu in percent, pixels, or other units. This menu may have a relative (it can be inserted into the table, for example) or absolute position .
  • Use special prefixes for image paths and links to make paths absolute.
  • You can assign your own images for lines.

Recent Questions Rails Dhtmlxtree

Q: I am intersted in a horizontal drop down menu.

I need the rollover and selected color of each section in the onmouseover drop down menu to be a different color.

Here is my scenario

link1 link2 link3
All links are white.
On rollover, link1 turns red, and the drop down below is red (if possible can each individual link in the the dropdown rollover to a diffrent color, say pink?)
When you click a link in the link1 dropdown, and go to that page, link1 will now be red (highlighted) while on that page, and link2 and link3 are still white.

Now, On rollover, link2 turns blue, and the drop down below is blue(if possible can each individual link in the the dropdown rollover to a diffrent color, say light blue?)
When you click a link in the link2 dropdown, and go to that page, link2 will now be blue, and link2 and link3 are still white. I also need the flyout menus to be able to be different widths. Say the drop down menu under link1 has short links, then it only needs to be 100 pixels wide. If the sublinks under link 2 are longer, its dropdown menu might need to be 200 pixels wide. In other words, the flyout width needs to be flexible to fit the length of the text in the link.
I have tried other programs, but have found none that can do this. The problem seems to be they cant have different width flyout menus (often this is the case if they are css based).
OR
It is not possible to show a 'up' or highlighted color on a main link when you are on a page that is a sublink)

Does this make sense, and is it possible with your builder?

A: Yes, you can create such a menu using JavaScript Tree Menu.

To use different font colors for the main items you should useIndividual Item styles. And to cerate different color and differentwidth of the submenus you should use Individual Item/Submenu styles.

See the attached example.zip. See how you should use styles.

> I also need the flyout menus to be able to be different widths.
Actually the submenu width is depend on the item's size. You can alsowrap item's text. Set   var noWrap=0; or use standard <br> tagsinside items' text:

 ["|very long text <br> in Item 14","", "", "", "", "", "3", "1", "", "", "", ],

You can set exact width for each submenu using IndividualSubmenu Styles.

> When you click a link in the link1 dropdown, and go to that
> page, link1 will now be red (highlighted) while on that page, and
> link2 and link3 are still white.
You can find more info here:
http://www.deluxe-menu.com/highlighted-items-sample.html

JavaScript Tree Menu 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">onmouseover drop down 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 regret to inform you that I have not fail understand, how can change place of the icon in software Deluxe Tuner(Menu).


A: You should add icons for the item in the "Item Parameters" window.

Now you have:
  var arrowImageMain=["vertikalno menu.files/icon_office_tuner2.gif","vertikalno menu.files/arrv_black.gif"];
  var arrowImageSub=["vertikalno menu.files/arrv_black.gif","vertikalno menu.files/arrv_black.gif"];

But you should add "vertikalno menu.files/icon_office_tuner2.gif" iconin the "Item Parameters" window.

So you will have in your menuItems
  var menuItems = [

["New Item","testlink.html", "vertikalno menu.files/icon_office_tuner2.gif", "vertikalno menu.files/icon_office_tuner2.gif", , , , , , ],
 ["|New Item ","", , , , , , , , ],
 ["|New Item","", , , , , , , , ],
["New Item","", "vertikalno menu.files/icon_office_tuner2.gif", "vertikalno menu.files/icon_office_tuner2.gif", , , , , , ],
 ["|New Item","", , , , , , , , ],
 ["|New Item","", , , , , , , , ],
["New Item","http://deluxe-menu.com/order-purchase.html", "vertikalno menu.files/icon_office_tuner2.gif", "vertikalno menu.files/icon_office_tuner2.gif", , "_blank", , , , ],
 ["|New Item ","", , , , , , , , ],
 ["|New Item","", , , , , , , , ],
["New Item","testlink.htm", "vertikalno menu.files/icon_office_tuner2.gif", "vertikalno menu.files/icon_office_tuner2.gif", , , , , , ],
 ["|New Item ","", , , , , , , , ],
 ["|New Item","", , , , , , , , ],


Q: How do I change the background color for the floating drop down menu

A: To change menu colors you should change the following parameters:

  var menuBackColor="#F2F3F2";
  var itemBackColor=["#F2F3F2","#535353"];

You can also use Individual Item Styles to change the color of the specific items:
  var menuStyles = [
["menuBackColor=#F2F3F2"],
];

  var itemStyles = [
["itemBackColor=#F2F3F2,#535353"],
];

Q: I am spending a lot more time and have figured a few things out. One more question please: How do I specify the target link I want a dhtml submenu to go to?

I see HREF specified in the code, but no where in the program to specify it.


A: See, the following parameter sets target for all items

  var itemTarget="_self";

If you want to set different target for each item you should set it inthe "Item Parameters" window. Choose your item in the main window andset target in the target field.