Dhtml Vertical Menu by Deluxe-Menu.com
Dhtml Vertical Menu

Template:

Grey Rounded Menu Template - Pure Css Menu






    - 85% transparency for sub menus
    - Status string shows item labels
    - Visible over select boxes, iframes, pdf, flash, Java applets.
    - Personal CSS styles for separate menu elements
    - Deluxe Tuner - visual interface to create and modify dhtml menus easily and in no time.
    - Top items and submenus have a shadow
    - AJAX menu loading - loads web menu data from the server "on-the-fly".
    - Hundreds of pre-designed templates




2 0 Navigation Buttons by Web-Buttons.com v3.0.0
Buy Now!   ::  Free Trial Download   ::  Blog   ::  More Info

Menu Screenshots

Dhtml Vertical Menu Mouseover Popup Menu

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

Features

High Performance
  • AJAX menu loading - loads web menu data from the server "on-the-fly".
  • Commonly loads quicker than other html page elements
  • UL/LI items structure
  • Runs well with an unlimited number of submenus and items
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!
Dhtml Basic Dhtml Vertical Menu
Easy Setup
  • De Luxe Tuner. GUI interface to create your dhtml vertical 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 dhtml vertical menu samples
  • Hundreds of visual effects
  • Custom CSS styles can be applied for all menu settings
Cost Effective



2.0 Buttons by Web-Buttons.com v3.0.0
Buy Now!   ::  Free Trial Download   ::  More Info

Javascript Menu. DHTML Menu.

  • Setup menu parameters manually or using De Luxe Tuner. Then add some rows of a code within html page code and your menu is ready!
  • Use special Java Script methods for: Dynamic changing of items (link, text, icons, arrows and even individual style!). Addition/removing of items or submenus. Disabling and enabling menu items. Getting the info on every submenu, menu, and items. Changing appearance of items. Other coding tricks.
  • Cross-frame mode lets you to construct full-featured dhtml menus on the pages with frames. But for all that frame set it's not necessary to insert any additional code into all the pages - just specify several extra menu parameters.
  • Ability to handle the menu from the keyboard via keystrokes.
Buy Now!   ::  Free Trial Download   ::  More Info

Recent Questions

Q: I want to buy your product today, but have a few questions:

How do I change the font style for java menu templates to 9pt Verdana bold, but leave the sub-menus 9pt Verdana normal? I understand there’s a "fontStyle" variable, but is there an "itemfontStyle"? How do I make the left hand padding greater for the menu? I’m using the XP Style 1 and the far left top menu item is running up against my left hand border. I want to add about 10px of spacing to the left of the menu. How do I make the options in a menu have equal spacing? For instance, if there are 5 items in the menu, how can each have 100% / 5?

A: You can use Individual Item styles to set specific parameters for eachitem or submenu.

1.
  var fontStyle=["normal 9pt Verdana","normal 9pt Verdana"]; //for subitems
//style for the top items
  var itemStyles = [
["itemHeight=21px","itemBackColor=#F2F3F2,#1665CB","fontStyle='bold 9pt Verdana','bold 9pt Verdana'"],
];

2., 4. You should specify itemPadding parameter in "px". You shouldadd "px" in your style for subitems:
  var menuStyles = [
["menuBackColor=#F2F3F2","menuBorderWidth=0","itemSpacing=1","itemPadding=4px","smOrientation=undefined"],
];

Notice also that you can set multiple value for itemPadding parameter,for example:

itemPadding=4px 10px 4px 10px
top right bottom left
4. You should set the exact width for the java menu templates:
  var menuWidth="500px";
and set width for the top items using Individual styles:
["itemWidth=100px","itemHeight=21px","itemBackColor=#F2F3F2,#1665CB","fontStyle='bold 9pt Verdana','bold 9pt Verdana'"],

Unfortunately it is not possible to specify item's width in '%' inIndividual styles. The following width parameters won't work.

  var menuWidth="100%";
["itemWidth=20%","itemHeight=21px","itemBackColor=#F2F3F2,#1665CB","fontStyle='bold 9pt Verdana','bold 9pt Verdana'"],



Q: That worked for the rollover drop down menu but I lost my drop shadow on the main menu. The sub-menus still have it. The preview has the drop shadow but when I view it in IE it is not there.

A: You should check the following parameters:

  var shadowLen=3;
  var shadowColor="#B1B1B1";
  var shadowTop=1;



Q: Is it possible to show a menu item in the simple navigation bar as selected by default to indicate what the current page is?


A: The 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">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" 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've downloaded and installed the trial software and have built the example that came with it.

What I would like to do is make the sub items ("New Sample 1" - "New Sample 5") display when the user clicks "Sample Block 1", rather than having to click the little + sign next to it.


A: You should set the following parameter:

  var texpandItemClick=1;

Try that.


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