Jquery Vertical Menu by Deluxe-Menu.com
Jquery Vertical Menu

Menu Screenshots

Jquery Vertical Menu Html Drop Down Horizontal Menu Tutorial

Features

Cost Effective
Easy Setup
  • De Luxe Tuner. GUI interface to create your jquery vertical menu menus easily and in no time
  • Sensible menu parameters for manual editing
Download Sample Navigation Bar Jquery Vertical 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
  • Section 508 compliant
Professional Look-n-feel
  • Entirely customizable look-n-feel
  • A lot of pre-designed jquery vertical menu samples
  • Hundreds of visual effects
  • Custom CSS styles can be applied for all menu settings
Unrivalled Features
  • Scrollable, dragable, floating, right-click menus
  • Keyboard navigation - press Ctrl+F2 to enter the menu
  • 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".
  • Search feature - add the search area in the menu and type symbols. The found words will be higlighted.
  • Sound support!



2.0 Buttons by Web-Buttons.com v3.0.0

Javascript Menu. DHTML Menu.

  • Sub menus dropdown over all the objects on the page (select, applet, flash, object, embed). If for some reasons (old browser) a submenu can't go over an object, the object will be hidden for a time when the submenu is shown.
  • Design personal styles for any submenu and item. Use individual styles to rich killer visual effects!
  • These effects will make your menu neat and chic. You can set transparency, cast a shadow on the menu and submenus. Among available special visual effects there are random dissolve, fade, mix, mosaic slide out and many many others.

Recent Questions

Q: I need a menu system where on the click of certain items, server side code on the page can be called and executed. Can that be done using deluxe menu?

A: You can use your own Javascript code instead standard links. For example:

  var menuItems = [
["text", "javascript:your_code_here"]
];



Q: Very interested by your product.I want to know, before buy, if I can call javascript function when the user click on a items in the horizontal drop down menu?

A: You're able to use Javascript for each item, for example:

  var menuitems = [
["item text", "javascript:your_code_here"]
];

Unfortunately, you can't assign onmouseover/onClick event to each item.
However, you can achieve this by using standard html objects within items, for example:

  var menuitems = [
["<div onClick='your_code_here'>item text</div>", "index.html"]
];

Q: I would like to know how to define separator on itemstyle or how to show separator on menu items.

Thanking you in advance.


A: You should set a separator in the menuItems, for example:

  var menuItems = [
["Home","index.cfm", , , , , , , , ],
["-"],
["About Us","about.cfm", , , , , , , , ],
];

Please, see the following parameters:

//--- Separators
  var separatorImage=""; //for subitems
  var separatorWidth="100%";
  var separatorHeight="3px";
  var separatorAlignment="right";
  var separatorVImage="images/public/separator.gif"; //for the top items
  var separatorVWidth="100%";
  var separatorVHeight="2px";
  var separatorPadding="";


Q: I am trying to make the tab menu to work correctly and after extensive testing and I have come across a problem that I can seem to get resolved. I am using images for the tab menu with no text and <divs> to display information about each javascript new menu tab. However while the page loads I can see all the content from all the <div> javascript new menu tabs and when the page if fully loaded, the web page then displays the content correctly with all the content hidden until the correct tab is selected. Mind you this is the only thing on the webpage so there shouldn’t be any load time problems.

Please advice what is happen to resolve this issue.

A: Try to set display: none; property for the style of your DIV, forexample:

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

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

</div>