Javascript Collapsible Menu Unordered List by Deluxe-Menu.com
Javascript Collapsible Menu Unordered List

Menu Screenshots

Javascript Collapsible Menu Unordered List Basic Drop Down Menu

Features

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
Easy Setup
  • De Luxe Tuner. GUI interface to create your javascript collapsible menu unordered list menus easily and in no time
  • Sensible menu parameters for manual editing
Javascript Position Menu Flyouts Javascript Collapsible Menu Unordered List
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
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
Professional Look-n-feel
  • Entirely customizable look-n-feel
  • A lot of pre-designed javascript collapsible menu unordered list samples
  • Hundreds of visual effects
  • Custom CSS styles can be applied for all menu settings



2.0 Buttons by Web-Buttons.com v3.0.0

Javascript Menu. DHTML Menu.

  • There can be multi level menus - create as many rows or columns of the menu as you want.
  • Use a mouse to drag a menu as a usual window. Also you can construct the menu where each submenu can be "detached" from the main menu (MSOfficeToolbarLike mode).
  • When the page is scrolled the menu remains visible. The DHTML menu can "float" along one or two coordinate axes.

Recent Questions

Q: When I click between tabs, only one tab remains in its active state for a dhtml tab navigation.
Why isn't the tab changing to look "active" to reflect the page that it's on?
Please let me know where this setting is.


A: Deluxe Tabs doesn't support API functions which can return theselected tab.

You can set "bselectedItem" and "  var bselectedSmItem" parametersbased on your link before you call your data file.

For example, move "  var bselectedItem" and "  var bselectedSmItem" parametersfrom your data file to your code.

<TD vAlign=top align=left>
/* Select Tab */
<script type="text/javascript" language="JavaScript1.2">
  var bselectedItem=<?php echo $seltabs; ?>;
  var bselectedSmItem=<?php echo $selsmtabs; ?>;
</script>
<SCRIPT src="data.js" type=text/javascript></SCRIPT>
</TD>

You should define seltabs and selsmtabs using server side script.

You can also set it on every page before you call data.js file, forexample:

<TD vAlign=top align=left>
/* Select Tab */
<script type="text/javascript" language="JavaScript1.2">
  var bselectedItem=4;
  var bselectedSmItem=3;
</script>
<SCRIPT src="data.js" type=text/javascript></SCRIPT>
</TD>

Try that.




Q: How can I use Danish characters in my dhtml menu bars?

A: You should turn on "Tools/Use utf8 encode" property.
In that case your data file will be saved in UTF-8 encode. So, you
should set UTF-8 encode on your page too

<meta http-equiv="Content-Type" content="text/html"charset="UTF-8">

If you don't want to use UTF-8 encode on your page you should turn off
"Tools/Use utf8 encode" property, save your data file and manually
change your letters in any text editor.



Q: Would it be possible at some point to introduce more font decoration options to the mouseover variables, I would like to add bold as a mouseover font decoration, but obviously this is not possible at the moment.


A: Unfortunately, Deluxe Menu doesn't have such a feature. You can onlyset it's color. You cannot set the font of menu item bold when selected.

You should addthe following code in your data file:

function changeFont(obj, over)
{
obj.style.fontWeight = over ? 'bold' : 'normal';
obj.style.fontSize = over ? '13px' : '12px'; // You can not use this line
}

  var menuItems = [

["<div onMouseOver='changeFont(this, 1)' onMouseOut='changeFont(this, 0)'>Security</div>","", "", "", "", "", "", "", "", ],
["<div onMouseOver='changeFont(this, 1)' onMouseOut='changeFont(this, 0)'>Ease of Access</div>","", "", "", "", "", "", "", "", ],
["|<div onMouseOver='changeFont(this, 1)' onMouseOut='changeFont(this, 0)'>Internet Options</div>","", "", "", "", "", "", "", "", ],
["|<div onMouseOver='changeFont(this, 1)' onMouseOut='changeFont(this, 0)'>Windows Firewall</div>","", "", "", "", "", "", "", "", ],
["<div onMouseOver='changeFont(this, 1)' onMouseOut='changeFont(this, 0)'>Network and Internet</div>","", "", "", "", "", "", "", "", ],
["<div onMouseOver='changeFont(this, 1)' onMouseOut='changeFont(this, 0)'>Hardware</div>","", "", "", "", "", "", "", "", ],



Q: By the way, this is an issue at your site, too...

Have a look at
http://deluxe-menu.com/objects-overlapping-sample.html in
FireFox - when hovering over the Product Info or Samples buttons, the Deluxe Menu flash element disappears behind the drop-down menu.

I notice this pages states: "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.".


A: Unfortunately, it is really so.
Now there is no work around for this.
We'll try to fix this bug in the future version of Deluxe Menu.