Dhtml Hover Context Menu by Deluxe-Menu.com
Dhtml Hover Context Menu

Menu Screenshots

Dhtml Hover Context Menu Java Menu Makers

Features

Easy Setup
  • De Luxe Tuner. GUI interface to create your dhtml hover context 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 hover context menu samples
  • Hundreds of visual effects
  • Custom CSS styles can be applied for all menu settings
Sample Code For Create A Menu Using Javascript Dhtml Hover Context Menu
Cost Effective
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
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



2.0 Buttons by Web-Buttons.com v3.0.0

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.

Recent Questions

Q: How i can to order tabs in the onclick tab menu from right to left ??

A: Try to use that parameter:

  var bitemAlign="right";

Q: I have images that I want to use for the top level of the menu. How do I create a menu using images that were created in a different program? I tried to look in the frequently asked questions but IcouldnТt find anything that told me how. Thank you in advance for your help.


A: You can use any image for the top items.

You can set
  var itemBackImage=["",""];
Or, create Individual style

  var itemStyles = [
["itemWidth=92px","itemBorderWidth=0","fontStyle=normal 11px Tahoma","fontColor=#FFFFFF,#FFFFFF","itemBackImage=data-vista-03.files/btn_magentablack.gif,data-vista-03.files/btn_magenta.gif"],
];

The new method of making image-based menus: if item text is empty, icon fields will be used as item images.

For example:

["", "index.html", "itemImageNormal.gif", "itemImageOver.gif", "Home Page"]


Q: I have small problems with your javascript menu system.

#1. I am creating a multi-level menu, am I limited to a gird format or can every item have a variable column width?

#2. With submenus, I want to have the submenu be the same width as the parent cell, is there a simple command for this, or do I have to guess the column widths until it fits correctly?

#3. In those same submenus, I have items that are longer than the parent, is there a word wrap or a way to define a break, rather than having the scroll feature?


A: 1) You should use Individual Item Styles.
For example:
  var itemStyles = [
    ["itemWidth=120","itemBorderWidth=1","itemBorderStyle=solid,solid","itemBackColor=#ACF88B,#ACF88B","itemBorderColor=#329309,#329309"], //style0
    ["itemWidth=100","itemBorderWidth=1","itemBorderStyle=solid,solid","itemBackColor=#FFFFFF,#FFFFFF","itemBorderColor=#1B92E9,#1B92E9"], //style1
    ["itemWidth=130","itemBorderWidth=1","itemBorderStyle=solid,solid","itemBackColor=#FF9684,#FF9684","itemBorderColor=#EC7575,#EC7575"], //style2
    ["itemWidth=150","itemBorderWidth=1","itemBorderStyle=solid,solid","itemBackColor=#84F9FF,#84F9FF","itemBorderColor=#00B8C1,#00B8C1"], //style3
];
  var menuStyles = [
    ["smColumns=2"], //style0
];

    ["Home","testlink.htm"],
    ["Samples","testlink.htm"],
      ["|Group 1","", , , , , "0", , , ],
      ["|Group 2","", , , , , "1", , , ],
      ["|Group 3","", , , , , "2", , , ],

...
    [" More Samples","testlink.htm"],
      ["|Group 1","", , , , , "3", "0", , ],
      ["|Group 2","", , , , , "1", , , ],

Where "0", "1", "2", "3" - style number in itemStyles.

2) You can also use Individual Item Styles.

  var itemStyles = [
     ["itemWidth=120px"],
];
  var menuStyles = [
     ["smWidth=120px"],
];

    ["Product Info","", "default.files/icon1.gif", "default.files/icon1o.gif", , , "0", , , ], // itemStyles
      ["|Features","testlink.html", "default.files/icon2.gif", "default.files/icon2o.gif", , , , "0", , ],
      ["|Installation","", "default.files/icon2.gif", "default.files/icon2o.gif", , , , , , ], // menuStyles

3) Try to set this parameter:

  var noWrap=0;


Q: What is occurring is that the information on the first tab is appearing on every tab. The other tabs are behaving correctly, but the first tab appearing at the top.


A: Now you have such items

["$Contacts", "contacts",,,,"How to contact Civil Liberties Australia", "0"],
["The Board", "board",,,,"Members of the CLA Board", "0"],
["Policies", "policy",,,,"An outline of CLA's policies", "0"],
["Other Matters", "other",,,,"Other administrative matters of CLA' page","0"],

But I cannot find DIV with ID "contacts".

May be you should write

["$Contacts", "content",,,,"How to contact Civil Liberties Australia", "0"],

Please, check it.