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

Template:

iPhone 3 Template - Cross Browser Dhtml Menu






    - Image arrows
    - Personal CSS styles for separate menu elements
    - Text aligned to left
    - Submenus go over all page objects
    - Special JavaScript API for changing javascript menu "on-the-fly"
    - Hundreds of pre-designed templates
    - Filters and Transitional effects
    - Inactive/Disabled items




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

Menu Screenshots

Vertical Collapsible Menu Cascading Menu Crossframe

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

Features

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
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
Dhtml Drop Down Menus Tutorial Vertical Collapsible Menu
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
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!
Cost Effective



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

Javascript Menu. DHTML Menu.

  • Use a mouse to move a menu as a usual window. Also you can create the menu where each submenu can be "separated" from the menu (MS Office toolbar-like mode).
  • When the page is scrolled the menu remains visible. The menu can "float" along one or two coordinate axes.
  • There can be multilevel menus - create as many rows of the menu as necessary. Any submenu in its turn can include different number of columns.
Buy Now!   ::  Free Trial Download   ::  More Info

Recent Questions

Q: I have to find out, how the javascript tree control is NOT expanding in the beginning..

A: You should set the following parameter:

  var texpanded=0;

Use + signs before items text to expand some items:

["+Land","", "", "", "", "", "", "0", "", "", ],

Q: The drop-down submenus are now going "up" instead of "down" in the drop down menus in javascript.

A: Set the following parameter:

  var subMenuVAlign="top";


Q: Is there a tutorial on how to use css navigation bar

A: Unfortunately we don't have step by step tutorial yet.
We'll try to create it in the nearest time.

1. Create your Css menu in Deluxe Tuner.

When you open Deluxe Tuner you can click "File/New"and add items and subitems using buttons "Add Item" and "Add Subitem" onthe main window.
See the parameters for the menu on the main window.

More info about menu parameters you can find on our site
http://deluxe-menu.com/css-menu/parameters-info.html

You can also use Individual Styles for items and subitems
http://deluxe-menu.com/individual-item-styles-info.html
http://deluxe-menu.com/individual-submenu-styles-info.html

2. You should install the menu on your page.
You can click, for example, File->Save Css Menu/Export HTML

So, you'll have folder with images ("deluxe-css-menu.files/" folder by default),deluxe-css-menu.html file and deluxe-css-menu.js file with all menu parameters (project file you need, if you wantto modify your menu later).

Open deluxe-css-menu.html file in any text editor and copy several rows ofcode into your page (for example index.html page of your website).

Copy and paste several rows into your html page (index.html).

<head>
...
<style>
ul.cssMenu ul{display:none}
ul.cssMenu li:hover>ul{display:block}
ul.cssMenu ul{position: absolute;left:-1px;top:98%;}
ul.cssMenu ul ul{top:-2px; left:98%}
ul.cssMenu {
...
ul.cssMenum0 li li {
margin:0px;
}
</style>
...
</head>

You should also copy "deluxe-menu.files/" folder with all imagesinto the same folder with your index.html page.

More info about installation:
http://deluxe-menu.com/css-menu/installation-info.html
Try that.

Q: I have another question:

Menu behavior in SAFARI is does not properly work compared to EXPLORER.

If you have a look at the site via SAFARI, please do the following:

Example:
Under menu "Projets" select "par pays" then "Afrique" then "Algerie".

It will then show a left hand menu. Please select "2008/2010".

It will correctly show content.

Then if you try to select again via menu "Projets"; the html menu navigation does not show anymore the submenus. You still need to click a menu without submenus, like "News", and then afterwards you can click "Projets" and the system will again show submenus.

This strange behaviour does not appear in EXPLORER nor in FIREFOX.

A: The problem is in your frame structure after you open "Projets" select "par pays" then "Afrique" then "Algerie".

Your menu won't work correctly with such frame structure.

You should use the following frame structure for all pages at once:

--------------------------------------------------------
topFrame with the html menu navigation
--------------------------------------------------------
Algerie_leftFrame |
with | Algerie_mainFrame
Tree Menu |
--------------------------------------------------------
bottomFrame
--------------------------------------------------------

and write your init function in the following way:
dm_initFrame("frmSet", 0, 2, 0);

Or you shouldn't use Algerie_leftFrame and Algerie_mainFrame at all (use one mainFrame) and write your init function in the following way:
dm_initFrame("frmSet", 0, 1, 0);

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