Css Collapsable Menu by Deluxe-Menu.com
Css Collapsable Menu

Template:






    - Submenus automatically scrolls
    - Special JavaScript API for changing javascript menu "on-the-fly"
    - Transition #14 - "fade out" effect
    - Image arrows
    - Status string shows item labels
    - Text aligned to left
    - Several menus on one page
    - 85% transparency for sub menus




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

Menu Screenshots

Css Collapsable Menu Menu Dinamic Javascript

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
Professional Look-n-feel
  • Entirely customizable look-n-feel
  • A lot of pre-designed css collapsable menu samples
  • Hundreds of visual effects
  • Custom CSS styles can be applied for all menu settings
Drop Down Menu Design Css Collapsable Menu
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
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
Easy Setup
  • De Luxe Tuner. GUI interface to create your css collapsable menu menus easily and in no time
  • Sensible menu parameters for manual editing



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

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.
Buy Now!   ::  Free Trial Download   ::  More Info

Recent Questions

Q: Can you send me the full detail how would I use your navigation bar generator for web site development?

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

1. Create your 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" on the main window.
You should set items and subitems parameters on the "Item Parameters"window.
See also other parameters for the menu on the main window.

More info about menu parameters you can find on our site
http://deluxe-menu.com/menu-items-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/Export to HTML.

So, you'll have folder with all engine files and images
("deluxe-menu.files/" folder by default), deluxe-menu.html file and
data-deluxe-menu.js file with all menu parameters.

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

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

<head>
...
<!-- Deluxe Menu -->
<noscript><a href="http://deluxe-menu.com">Javascript Menu by Deluxe-Menu.com</a></noscript>
<script type="text/javascript" src="deluxe-menu.files/dmenu.js"></script>
...
</head>

<body>
...
<table>
<tr><td><script type="text/javascript" src="deluxe-menu.files/data-deluxe-menu.js"></script></td></tr> //data-deluxe-menu.js - data file createdin Deluxe Tuner.
</table>
...
</body>>

You should also copy "deluxe-menu.files/" folder with all engine files
dmenu.js
dmenu_add.js
dmenu_dyn.js
dmenu_key.js
dmenu_cf.js
dmenu_popup.js
dmenu_ajax.js
dmenu_search.js
and data-deluxe-menu.js file into the same folder with your index.html page.

Try that.

You can see more info about installing here:
Deluxe Menu
http://deluxe-menu.com/installation-info.html
Deluxe Tree
http://deluxe-tree.com/installation-info.html
Deluxe Popup Window
http://deluxepopupwindow.com/window-installation-info.html
Deluxe Tabs
http://deluxe-tabs.com/product-info/

Q: From your website, I see that you are able to populate a menu through ASP/VB, but I have not been able to figure out how this is done.
How exactly do you use an ASP script to generate the menu items for the dynamic menu?

A: You may generate a menu from a database or XML using any server-side script, e.g., PHP, ASP, VB, etc.
However, these scripts don't work inside of Javascript .js files, so, you should move parameters of a menu from a .js file into an html-page, e.g.:

<!-- Deluxe Menu -->
<noscript><a href="http://deluxe-menu.com">Javascript Menu by Deluxe-Menu.com</a></noscript>
<script type="text/javascript">  var dmWorkPath = "menudir/";</script>
<script type="text/javascript" src="menudir/dmenu.js"></script>
<!-- (c) 2006, http://deluxe-menu.com -->

<script type="text/javascript" language="JavaScript1.2">
// and describe parameters of a menu
  var parameter1=value1;
  var parameter2=value2;
etc.

  var menuItems = [
// here you generate items using server-side scripts (php, asp, vb, etc.)
];
</script>

Unfortunately we don't have examples with ASP and SQL.
The example of the menu working with PHP/MYSQL you can find here:
http://deluxe-menu.com/rq-loading-bar-MySQL-support.html




Q: I got the menu to display across frames, but it displays differently in Firefox & Mozillavs. Internet Explorer. Is that to be expected?

In The Mozilla-based browsers, the submenu butts right upunder the main menu – which is how I want it. In IE, it is about 10 pixels below.

Also, I can’t get the submenus to drop down directly under the main menus – they are offset by about 100 pixels to the right.

A: The problem is in a structure of your frameset.
Mozilla browsers can't determine absolute coordinates for a frame, sosubmenus drop down with an offset.

You should create the following frameset structure:

--|------------
   | menu
--|------------
   |
   | submenus
   |

Now a top row has 2 columns and all browsers can determine awidth of the 1st column in the second row.



Q: Is there a different type of menu, other than the way I have it set up, such as the tree type, that might load faster or take up less space when the page loads?


A: You should set
  var dmAJAX=1;
create .js files with your submenus and call this files from your mainfile, for example:

  var menuItems = [

["Home","testlink.htm"],
["Product Info","", , , , , , , "data-samples/data-ajax2.js", ],
["Samples","", , , , , , , "data-samples/data-ajax3.js", ],
["Purchase","testlink.htm"],
["Contact Us","testlink.htm"],
];

/*** data-ajax2.js ****/
  var menuItems = [
["Features","testlink.htm"],
["Installation",""],
["Parameters Info","testlink.htm"],
["Dynamic Functions","testlink.htm"],
["Supported Browsers",""],
];

Add dmenu_ajax.js file in the same folder with your dmenu.js file.

Try that.


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