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

Menu Screenshots

Jquery Vertical Collapsible Menu Creating Rollover Drop Down Menus In Javascript

Features

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!
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
Cool Menu Bars Jquery Vertical Collapsible Menu
Cost Effective
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



2.0 Buttons by Web-Buttons.com v3.0.0

Javascript Menu. DHTML Menu.

  • Tune menu parameters manually or using Deluxe Tuner. Then add several rows of a code within html page - your menu is ready!
  • Use special JavaScript functions for: Dynamic changing of items (text, link, icons and even individual style!). Making a menu item active/inactive. Addition/removing of items. Changing of visibility of items. Getting the information on any menu, submenu and items. Other tricks.
  • Opportunity to control the menu from the keyboard.
  • Cross-frame mode allows you to build full-featured menus on the pages that use frame-based structure. But for all that it's not necessary to insert any additional code into all the pages - just specify some additional parameters of the menu.

Recent Questions

Q: Do you have any working examples of a menu generated using .php from a MySQL database?

Our website is dynamic from a MySQL db and we already have categories and sub-categories. It would be useful if we could use this with our deluxe menu.

I don't know how to set this up, so any assistance would be appreciated.


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>

The example of the menu working with PHP/MYSQL you can find here:
http://deluxe-menu.com/rq-loading-bar-MySQL-support.html



Q: How do your users normally indicate which page a web visitor is on, by using your navigation bar submenu?

A: Deluxe Menu has only two states normal and mouseover.

Try to do the following things:

- delete   var pressedItem=1; parameter from your data file
- set correct parameter on each page before you call data file, for
example:

<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>
<script type="text/javascript">  var pressedItem=3;</script>
...
<script type="text/javascript" src="menudir/data.js"></script>

You can also set a pressed item using Javascript API:

function dm_ext_setPressedItem (menuInd, submenuInd, itemInd, recursion)

Sets a current pressed item.
menuInd - index of a menu on a page, >= 0.
submenuInd - index of a submenu, >= 0.
itemInd - index of an item, >=0.
recursion = true/false - highlight parent items.

But notice, to use dm_ext_setPressedItem() you should know ID of selected item and subitem.
You can't get this ID after you reload your page. That is why you should write your own code on PHP.



Q: Recently one of my clients apparently upgraded from Internet Explorer 6+ to 7. Along the way now apparently the javascript is no enabled.
How do I enable javascript on the new browser, and / o is there something else that I need to do in the code?


A: When your security settings in IE doesn't allow Javascript onpages you load you can't see a dynamic page content.

There is no way to enable these preferences automatically, in othercase there are no reasons to create security preferences.

Please, try to use search engine friendly code you'll see all yourlinks.

You can generate search engine friendly code.
Deluxe Menu is a search engine friendly menu since v1.12.
To create a search engine friendly menu you should add additional html code within your html page:

<div id="dmlinks">
<a href="http://deluxe-menu.com">menu_item_text1</a>
<a href="http://deluxe-tree.com">menu_item_text2</a>
...etc.
</div>

To generate such a code use Deluxe Tuner application.
You can find this GUI in the trial package.
Run Tuner, load your menu and click Tools/Generate SE-friendly Code (F3).

We released the new version today. New Deluxe Tuner supports DeluxeTree & Deluxe Tabs also.


Q: Hello, Could you please help me with an alignnment issue with my website. If you go to mt website you will see the problem. I set the x alignment to=266 but the y alignment is left blank because I would like to keep the menu centered on the site.


A: If you want to center the menu paste itwithin the <div> or <table> with a static position and specify a center alignment for it, for example:

<DIV align=center>
<SCRIPT src="data/data.js" type=text/javascript>
</SCRIPT>
</DIV>
Please, set exact value for   var menuWidth parameter, for example:

  var menuWidth = "300px";
This can help to align your menu correctly in all browsers.
Try also to specify units in "px".
Set also:
  var absolutePos = 0;

Try that.