Javascript Sliding Menu by Deluxe-Menu.com
Javascript Sliding Menu

Menu Screenshots

Javascript Sliding Menu Javascript Layer Menu

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



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: I am having some trouble placing the menu drop down vertical in frontpage. Does your company have a toll free number and some kind of tech support for the frontpage material. We are very interested in your program.


A: Unfortunately, we don't provide support by phone, e-mail only.

See, you should do the following things.

1. Create your menu in Deluxe Tuner.
2. Export the menu into html file "File/Export/To HTML".
3. Copy generated folder with all engine .js files and images
("deluxe-menu.files/" by default) and data-deluxe-menu.js (by default) into the same folder with you index.html page (created inFrontPage).
4. Now you should add several rows of code into your index.html file.
You can do it in FrontPage (open HTML source of the page and edit it)or in any text editor. Open your index.html page and edit it.
Notice that you'll have errors in the Preview. But you won't get errors if you open this page in the browser.
5. Add the following code in the tag:

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

and
<script type="text/javascript" src="data-deluxe-menu.js"></script>
in the place where you want to have the menu.
You can paste it in <table>, <div> tags. For example.

<div align=center>
<script type="text/javascript" src="data-deluxe-menu.js"></script>
</div>
6. Save your index.html page and open it in any browser.


Q: I am facing problem with deluxe tab. When a first level jscript tab is selected, sub tab of that tab should be in selected mode.

I need to change text color of "New contact" (sub tab) in selected mode to black.

A: Unfortunately Deluxe Tabs doesn't have such a feature now.

You use main tabs to show sub-tabs and click on sub-tabs to show their content or openlinks.

On the initial page load you can set the selected item and submenu item using thefollowing parameters:

  var bselectedItem=1;
  var bselectedSmItem=2;


Q: Our requirement is to design a website using Cross Frame Menu ,
in allcombinations like Horizontal Menu with sub menus Vertical Menu with sub menus
Let me know the necessary information to create Cross Frame Menu using your side dropdown menu..


A: See how should you create cross frame menu:

1. To initialize the cross frame menu call dm_initFrame()
function instead of standard dm_init() function within data.js file:

dm_initFrame(framesetID, mainFrameInd, subFrameInd, orientation);

framesetID - id attribute of the frameset;
mainFrameInd - index of the main frame (where the top-menu is placed), >=0;
subFrameInd - index of the subframe (where the submenus will be shown), >=0;
orientation - frame orientaion: 0 - top-to-bottom, 1 - left-to-right; 2 - bottom-to-top; 3 - right-to-left.

So you should create your menu in Deluxe Tuner, save it.
Create html file with your frame set.

Set ID for the first frameset:
<FRAMESET id=frmSet rows=220,*>
<FRAME id=frame1 src="Deluxe Menu Samples_files/cross-frame-horizontal-1.htm"> //menu frame
<FRAME id=frame2 name=frame2 src="Deluxe Menu Samples_files/testlink.htm"> //content frame
</FRAMESET>

Then you should open your data file in any text editor and change
dm_init(); for example to dm_initFrame("frmSet", 0, 1, 0);

You'll find more info here:
http://deluxe-menu.com/cross-frame-mode-sample.html



Q: Hi. I have the following problem with deluxe-menu:

Created flash drop menu doesn’t show up in IE7, but works properly in Firefox. Tried to play with IE7 security settings – doesn’t help. You can see it at freebusinesslist.com.au if youlike.


A: Try to set width in "px" for the menu.

  var menuWidth="450px";