Free Menubar With Submenu by Deluxe-Menu.com
Free Menubar With Submenu

Menu Screenshots

Free Menubar With Submenu Rollover Drop Down Menu Tutorial

Features

Professional Look-n-feel
  • Entirely customizable look-n-feel
  • A lot of pre-designed free menubar with submenu 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!
Javascript Hiding Navigation Bar Code Samples Free Menubar With Submenu
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
  • Section 508 compliant
Seamless Integration
  • Cross-frame support - menus work on frameset-based pages
  • 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



2.0 Buttons by Web-Buttons.com v3.0.0

Javascript Menu. DHTML Menu.

  • Submenus drop down over all the objects of the page (select, flash, object, embed, applet). If for some reasons a submenu can't drop down over an object, the latter will be hidden for a time when the submenu is shown.
  • These effects will make your menu more attractive and stylish. You can cast a shadow on the menu and submenus, set transparency. Among available transitional effects there are such as fade, mosaic, random dissolve, slide out and many others.
  • Create individual styles and assign them to any submenu and item. Use individual styles to achieve stunning effects!

Recent Questions

Q: Can I install the menu using my buttons? I might be able to do it if the buttons used only one image, but they use two images. One is light and the other dark.

I also have some questions:
1) Will the menu stay in view when the user scrolls down?

2) I'm not even sure I care if the menu stays in view, because I believe that is done using php and is not good for SEO. The file that the search engines see is index.html while the file that visitors see is home.php. I think it would be better for SEO to have a normal .html page. Are you able to do that?


A: See how you should make image-based menus: if item text is empty, icon fields will be used as item images.
For example:
["", "index.html", "menu1a.gif", "menu1b.gif", "Home Page"]

1) You should use floatable feature.
See the following parameter:
  var floatable=1;

2) You can generate search engine friendly code using Deluxe Tuner:
"Tools/Generate SE-friendly Code".


Q: Actually, we figured out how to adjust the alignment of the text. What we would like to do is set a specific width for each item on the top level of the menu. Right now the width of the menu is based on the length of the item in that hotspot. We would like the width of each of those options to be the same.


A: You should use individual item styles. For example:

  var itemStyles = [
["itemWidth=123px"], //style 0
["itemWidth=150px"], //style 1
];

  var menuItems = [

["Home","testlink.html", , , , , "0", , , ], //style 0
["Product Info","", "deluxe-menu.files/icon1.gif", "deluxe-menu.files/icon1o.gif", , , "0", , , ], //style 0
["Text","", "deluxe-menu.files/icon1.gif", "deluxe-menu.files/icon1o.gif", , , "1", , , ], //style 1

Try that.


Q: I want to be able to put a small thumbnail icon in the description area of animated drop down menu. Here is a current line from my .js file for a single link.

 ["|'Slow Death Hook' Contest<br><br><br>Enter Your Favorite Fish Photos to Win!<br>Gary Parsons ","http://www.domain.com/site/featured_article.cfm?owner=AB18D298-0AC7-254E-B7248E9DCD0F9549 ",,,,,"0"],

I want it to do this though:

 ["|'Slow Death Hook' Contest<br><br><br>Enter Your Favorite Fish Photos to Win!<br>Gary Parsons ","http://www.domain.com/site/featured_article.cfm?owner=AB18D298-0AC7-254E-B7248E9DCD0F9549 <br><br><img src="images/thumbnail.jpg">",,,,,"0"],

The problem is the "'s around the img src.....it's throwing off your animated drop down menu.

How do I fix that?

A: It is not correct to write menuItems in such way.

You should write:

 ["|'Slow Death Hook' Contest<br><br><br>Enter Your Favorite Fish Photos to Win!<br> Gary Parsons <br><br><img src='images/thumbnail.jpg'>","http://www.domain.com/site/featured_article.cfm?owner=AB18D298-0AC7-254E-B7248E9DCD0F9549",,,,,"0"],

Try that.



Q: I tried the following for subitem and it worked but not working with the "Title item" (Group or header item), is there a way to process onclick for the title item? Thanks again.

You're able to use Javascript for each item, for example:
  var tmenuitems = [
["item text", "javascript:your_code_here"]
];

A: Unfortunately, title items doesn't allow to use Javascript in the sameway.
But you can do the following:

  var tmenuitems = [
["<div onclick='your_code_here'>title text</div>"]
];