Jquery Slidein Menu by Deluxe-Menu.com
Jquery Slidein Menu

Menu Screenshots

Jquery Slidein Menu Javascript Menu Tree

Features

Easy Setup
  • De Luxe Tuner. GUI interface to create your jquery slidein menu menus easily and in no time
  • Sensible menu parameters for manual editing
Cost Effective
Simple Horizontal Dhtml Menu Jquery Slidein Menu
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
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
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.

  • Sub menus dropdown over all the objects on the page (select, applet, flash, object, embed). If for some reasons (old browser) a submenu can't go over an object, the object will be hidden for a time when the submenu is shown.
  • Design personal styles for any submenu and item. Use individual styles to rich killer visual effects!
  • These effects will make your menu neat and chic. You can set transparency, cast a shadow on the menu and submenus. Among available special visual effects there are random dissolve, fade, mix, mosaic slide out and many many others.

Recent Questions

Q: It seems that if I try and use the syntax  ["| with some HTML such as <DIV class = 'myclass'> inside dropdown menu it IGNORES the HTML and just treats it like another link.
But if I don't start the line with  ["| ..... Then I get a syntax error.

For example:

I am trying to place 4 links in a square shape in the top left of my screen. To do this I was going to create DIV's and set the TOP and LEFT to different values from within a loop (I left out the code that does the updating for myleft and mytop...)

  var menuItems = [

<loop>

 ["|<div style='position: absolute; left: <cfoutput>#myleft#</cfoutput>px; top: <cfoutput>#mytop#</cfoutput>px>'","", "", "", "", "", "", "", "", "", "",],

 ["|#ParentMenuDesc#","index.cfm?Workflow=#Workflow#&role=#Privilege_id#&cacheid=#createuuid()#&Process_Type=#Process_Type#&PageMode=#Process_Logic#", "#menu_option_icon#", "", "", "_top", "", "", "", "", "",],

 ["|</div>","", "", "", "", "", "", "", "", "", "",],

<end loop>

];

What am I doing wrong here?.... Can you show me how to accomplish this task?

A: No, this syntax is incorrect. It won't work.

  var menuItems = [

<loop>

 ["|<div style='position: absolute; left: <cfoutput>#myleft#</cfoutput>px; top: <cfoutput>#mytop#</cfoutput>px>'","", "", "", "", "", "", "", "", "", "",],

 ["|#ParentMenuDesc#","index.cfm?Workflow=#Workflow#&role=#Privilege_id#&cacheid=#createuuid()#&Process_Type=#Process_Type#&PageMode=#Process_Logic#", "#menu_option_icon#", "","", "_top", "", "", "", "", "",],

 ["|</div>","", "", "", "", "", "", "", "", "", "",],<end loop>

];

You should have <div> ... </div> tags in each dropdown menu item!
It is not correctly to write <div> ... </div> tags for wholesubmenu.

  var menuItems = [
 ["|<div style='position: absolute; left:<cfoutput>#myleft#</cfoutput>px; top: <cfoutput>#mytop#</cfoutput>px>text</div>'","", "", "", "", "", "", "", "", "", "",],

 ["|#ParentMenuDesc#","index.cfm?Workflow=#Workflow#&role=#Privilege_id#&cacheid=#createuuid()#&Process_Type=#Process_Type#&PageMode=#Process_Logic#", "#menu_option_icon#", "","", "_top", "", "", "", "", "",],

 ["| ","", "", "", "", "", "", "", "", "", "",],
];



Q: May I can use PHP code in menu items of my dhtml website navigation 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>

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 would like to create my own jpeg images and use them as the mouseover-items in the top level drop down menus. I am not talking about the backround. I mean the actual upfront button.
I seem to be locked into the size which is the default and would like to change it to width = 180px and height = 45px for each item in the menu.
Is there any way to do that?


A: You should create Individual Style and assign it for all top items.

  var itemStyles = [
["itemWidth=180px"],
];

  var menuItems = [

["Home","testlink.html", "", "", "", "", "0", "", "", ],
["Product Info","", "deluxe-menu.files/icon1.gif", "deluxe-menu.files/icon1o.gif", "", "", "0", "", "", ],


Q: The menu files need to be in EVERY directory that there is a page calling these files?


A: No you can use one folder with engine .js files.
But in your html pages you should write correctly your dmWorkPathparameter:

< script type="text/javascript">  var dmWorkPath = "./menudir/";</script>

and call dmenu.js file from the right place

<script type="text/javascript" src="./menudir/dmenu.js"> </script>