Dijit Menu Example by Deluxe-Menu.com
Dijit Menu Example

Menu Screenshots

Dijit Menu Example Tree Menu Mouse Over

Features

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



2.0 Buttons by Web-Buttons.com v3.0.0

Javascript Menu. DHTML Menu.

  • Apply any font of any color, size and font decoration you need. Use any available type, color and thickness of a menu's frame. Choose any color for submenus and items backgrounds.
  • Set the size of the menu in percent, pixels, or other units. This menu may have a relative (it can be inserted into the table, for example) or absolute position .
  • Specify various values for spacing and padding for the whole menu and for each separate submenu.
  • You can specify a time for delays in showing or hiding of a submenu. Use special prefixes for image paths and links to make paths absolute.
  • Create separators using your own pictures, size and alignment.

Recent Questions

Q: I am totally confused by this now but I have 2 data files - one for a menu bar going horizontal and one going vertical both containing the same information. But even though the content is the same, the layout is different.

You will see that on the horizontal menu,

Fleet
Financce
CPC Cards
Cashire

These are listed correctly under each other but on the vertical one, the layout differs.


A: You should write your parameters more carefully.
See, now you have

menuItems = [
["About us","javascript:alert('Coming Soon')", , , ,"" ,0 , , , ],
   ["|||Organisation Chart","javascript:alert('Coming Soon')", , , ,"" ,1, , , ],

First you have the 1-st level of menu items then at once 4-th. It isnot right. You should write the number of your Individual Style in ""also.

See, how you should write your menuItems:

menuItems = [
["About us","javascript:alert('Coming Soon')", , , ,"" ,"0" , , , ],
 ["|Organisation Chart","javascript:alert('Coming Soon')", , , ,"","1", , , ],
 ["|Who's Who?","/k6intranet2.nsf/PageTitleLookup/Who's Who?OpenDocument", , , ,"" ,"1", , , ],
 ["|Contact Details","javascript:alert('Coming Soon')", , , ,"" ,"1", , , ],
["How To?","javascript:alert('Coming Soon')", , , ,"" ,"0", , , ],
 ["|Fleet","javascript:alert('Coming Soon')", , , ,"" ,"1", , , ],
   ["||Hire a Vehicle","/k6intranet2.nsf/PageTitleLookup/Hire a Vehicle?OpenDocument", , , ,"" ,"1", , , ],
   ["||Report an Accident","/k6intranet2.nsf/PageTitleLookup/How to report an accident?OpenDocument", , , ,"" ,"1", , , ],
   ["||Report a Breakdown","/k6intranet2.nsf/PageTitleLookup/Report a Breakdown?OpenDocument", , , ,"" ,"1", , , ],
 ["|Finance Admin","javascript:alert('Coming Soon')", , , ,"" ,"1", , , ],
   ["||Capitalise an Asset","/k6intranet2.nsf/PageTitleLookup/capitalise an asset?OpenDocument", , , ,"" ,"1", , , ],
   ["||Pay your Personal Calls on Mobile Phone Bills","/k6intranet2.nsf/PageTitleLookup/Pay your personal calls on mobile phone bills?OpenDocument", , , ,"" ,"1", , , ],
   ["||Request a credit to be raised","javascript:alert('Coming Soon')", , , ,"" ,"1", , , ],
 ["|CPC Cards","javascript:alert('Coming Soon')", , , ,"" ,"1", , , ],
   ["||Request a new CPC user","/k6intranet2.nsf/PageTitleLookup/request a new cpc user?OpenDocument", , , ,"" ,"1", , , ],
   ["||Report a Lost/Stolen CPC Card","/k6intranet2.nsf/PageTitleLookup/Report a lost or stolen card?OpenDocument", , , ,"" ,"1", , , ],
   ["||Enquire about a general CPC query","/k6intranet2.nsf/PageTitleLookup/enquire about a general cpc query?OpenDocument", , , ,"" ,"1", , , ],
 ["|Cashier","javascript:alert('Coming Soon')", , , ,"" ,"1", , , ],
   ["||Request a Cashbook Manual Payment","/k6intranet2.nsf/PageTitleLookup/Request a Cashbook Manual Payment?OpenDocument", , , ,"" ,"1", , , ],
   ["||Request a Cashbook BACS Payment","/k6intranet2.nsf/PageTitleLookup/Request a cashbook Bacs payment?OpenDocument", , , ,"" ,"1", , , ],
["Useful Information","javascript:alert('Coming Soon')", , , ,"" ,"0" , , , ],
 ["|Month End Timetable 2007","javascript:alert('Coming Soon')", , , ,"" ,"1", , , ],
 ["|Month End Year to Date Results","javascript:alert('Coming Soon')", , , ,"" ,"1", , , ],
   ["||Coming Soon...","javascript:alert('Coming Soon')", , , ,"" ,"1", , , ],
["Finance Focus","javascript:alert('Coming Soon')", , , ,"" ,"0" , , , ],
 ["|Coming Soon...","javascript:alert('Coming Soon')", , , ,"" ,"1", , , ],
["Coming Soon","javascript:alert('Coming Soon')", , , ,"" ,"0", , , ],
];

dm_init();


Q: I need to set individual itemtargets for a number of menu script items......

example:-

  var itemTarget="Main";

menuitem_1 targets the Main frame..

menuitem_2 ..

   SUBmenuitem_2_(1) targets the Top frame..

   SUBmenuitem_2_(2) targets the Main frame..

menuitem_3 ..

   SUBmenuitem_3_(1) targets the Main frame..

   SUBmenuitem_3_(2) targets the Bottom frame..

menuitem_4 targets the Main frame..

Is this possible?

A: You can set target parameter for all items:
  var itemTarget="_blank";
or
  var itemTarget="main";

Where main - is the name of the main frame where you want to open the link.

or for each item individually:
["Home","testlink.html", "", "", "", "_blank", "", "", "", "", "", ],
...
["Home","testlink.html", "", "", "", "main", "", "", "", "", "", ],



Q: I now wish to dynamically change the drop down menu in html parameters. For this, I have set the following parameters:

// Dynamic Menu
  var dynamic=1;

1.Please send me the reference link for the dynamic menu commands available (for javascript).

2.Now AFTER initialization, dm_init();, I wish to change the default   var itemTarget="Sub_Main";

How do I do that??

A: You can find more info about API functions here:
http://deluxe-menu.com/functions-info.html

Unfortunately it is not possible to change drop down menu in html parameters (  var ...)after menu initialization.
So, there is no way to change
  var itemTarget="Sub_Main";

But you can change target for each item individually (targetparameter in menuItems) using dm_ext_changeItem function.

  var menuItems = [
[text, link, iconNormal, iconOver, tip, target, itemStyleInd, submenuStyleInd, jsFilename],
[text, link, iconNormal, iconOver, tip, target, itemStyleInd, submenuStyleInd, jsFilename],
...
];



Q: Does this mean that nothing needs to be installed on the server side to make javascript menu?

Here is why I am asking this:

We have a main "corporate" web site, which is going to use the Deluxe Menu. One of the links on the main site will launch a page, which is running on a separate web server (physically separate server, and not a load-balancing scenario). Since all of these pages should look identical to the users, they all have to use the exact same configuration and look&feel in Deluxe Menu. I was wondering if any "configuration" type settings are stored on the server. In other words, would we have to maintain the Deluxe Menu install on two separate servers?

A: There is no need to install anything on your server. You should onlycopy a folder with all engine files (dmenu.js, dmenu_add.js, ...) anddata file on your server. Then you should call these files on yourpages, for example:

<body>
<script type="text/javascript">  var dmWorkPath="menu.files/";</script>
<script type="text/javascript" src="menu.files/dmenu.js"></script>
...
<script type="text/javascript" src="data.js"></script>

> In other words, would we have to
> maintain the Deluxe Menu install on two separate servers?
Actually you can copy deluxe menu files on the one server only anduse absolute paths.