Vertical Collapsible Menu by Deluxe-Menu.com
Vertical Collapsible Menu

Menu Screenshots

Vertical Collapsible Menu Create Submenus For Navigation Bar

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
Professional Look-n-feel
  • Entirely customizable look-n-feel
  • A lot of pre-designed vertical collapsible menu samples
  • Hundreds of visual effects
  • Custom CSS styles can be applied for all menu settings
Html Drop Down Menu Sample Code Vertical Collapsible Menu
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!
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
Cost Effective



2.0 Buttons by Web-Buttons.com v3.0.0

Javascript Menu. DHTML Menu.

  • Build right-click menus for your site. For this purpose you should appoint a peculiar method for the object you want. The current X,Y of the mouse pointer or your own ones can be used for the context menu.
  • Design menus absolutely based on CSS (Cascading Style Sheets). It is possible to apply the personal CSS styles for every elements of the menu.
  • When the submenu is bigger than the visible page area, the size of submenu will be automatically decreased. To view all the submenu items you do not need to use scrollbars or something like that - just put your mouse to the bottom of a submenu and it will be automagically scrolled! You can also define width and height for each submenu.

Recent Questions

Q: I'm testing out your cascading html menu but I cannot seem to see the live version of it on line. I can view it on my computer but I cannot send a link to my coworkers so they can view it also. Am I putting the code in the right location? Please point me into the right direction.

A: It is not correctly to call data file inside H2 tag
<h2> <script type="text/javascript" src="test1.js"></script></h2>

You should write
<script type="text/javascript" src="test1.js"></script>
or
<div>
<script type="text/javascript" src="test1.js"></script>
</div>

Check that you uploaded dtree.js and test1.js files on your server.


Q: Some menu entries may be disabled and clicking on them should produce predefined javascript alert message?


A: To create disabled items you should set "_" symbol in the targetparameter of the menuItems.
If the target is "_" the item is disabled.
You can assign a font color for all disabled items using the following menu parameter:
  var fontColorDisabled = "#AAAAAA";
You can write a javascript code instead of an item link:

["item text", "javascript:alert('Hello World')", , , ,"_",]

That's all.


Q: I'm a registered user. I'm looking to make a space between dhtml cross browser menu buttons, I checked the FAQ which suggested using ["-"], between items but it didn't work. It deleted the dhtml cross browser menu items below it. I'm looking to put a space between

   ["||All Images","gallery_all.html", , , , "_self", , , , ],

and

   ["||Pricing & Ordering Info","gallery_pricing.html", , , , "_self", , , , ],

A: To add a separator you should

//--- Separators
  var separatorImage=""; //for subitems (top items in vertical menu)
  var separatorWidth="100%";
  var separatorHeight="3px";
  var separatorAlignment="right";
  var separatorVImage="separator.gif"; //for the top items (subitems items in vertical dhtml cross browser menu)
  var separatorVWidth="100%";
  var separatorVHeight="2px";
  var separatorPadding="";

You can create separators using menuItems (you can do it in Deluxe
Tuner, use "Add separator" button), for example:

   ["||All Images","gallery_all.html", , , , "_self", , , , ],

   ["||-"],

   ["||Pricing & Ordering Info","gallery_pricing.html", , , ,"_self", , , , ],



Q: You will see I got the first level looking amazing.. this is exactly what I wanted. The interesting thing I figured out was not to use the item border.. this was messing things up. You may notice that when each item highlights.. there is a 1px white line at the separators.. but this is not produced with the item border, but rather from the separator itself which I made in two 1 pixel lines, one blue, on white.. this created that effect.

So now my only problem left is to figure out how to bring this look into the submenus. I was thinking it would be nice to use the separators in the same way throughout the submenus. There does not however seem to be a way to do this. When I tried inserting a separator into a submenu.. nothing happened... I am probably doing this wrong.

Can you please show me how to create the same look I have in the first level in the submenus.. this would be helpful.

I must say, this menu is finally starting to look the way I originally envisioned it. I am very happy. =o)

Thank you so much for all the help you have given me.


A: To add separators in submenus you should write it so:

 ["|-",] //first level submenus
   ["||-",] //second level submenus
and so on.

Try that.