|
|
|
Menu Javascript Parameters
The following parameters (vars) should be placed within data.js file.
 |
Special parameters
|
 |
| var dmWorkPath = "menu_files_path/";
|
It's necessary to define this parameter before dmenu.js if .js files of the menu aren't placed into the same directory where html page is placed.
For example, if the index page is in content/ directory and .js files are in content/menu/ directory, the parameter must be set to "menu/".
Notice: slash "/" must be placed at the end of the path.
For more details see the menu installation info.
|
|
|
|
Common
|
|
| Multi-row support
|
To create a multi-row menu add '$' symbol before an item text to make a new row.
|
| var isHorizontal = 1;
|
Menu javascript orientation: 0 - vertical, 1 - horizontal.
|
| var smColumns = 3;
|
Number of columns in each submenu. Default is 1.
|
| var smOrientation = 0;
|
Orientation of submenu: 0 - vertical (default), 1 - horizontal.
|
| var smViewType = 0;
|
The way of showing the menu.
0 - from left to right,
1 - from left to right + upwards,
2 - from right to left,
3 - from right to left + upwards (e.g. for right-to-left languages).
|
| var dmRTL = 0;
|
Set this parameter to 1 if you're using right-to-left direction of html page <HTML dir=rtl>.
Default is 0.
|
| var pressedItem = -2;
|
The toggle mode. Sets an index of an item that will be highlighted by default.
-2 - the toggle mode is disabled;
-1 - the toggle mode is enabled, but no items highlighted by default;
0,1,2,3,... - index of highlighted item in a top-menu.
|
| var itemCursor = "pointer";
|
Items cursor.
Available values: "auto", "default", "pointer", "move", "crosshair", "text", "wait", "help".
|
| var itemTarget = "_blank";
|
Default target for all menu items.
Available values: "_self", "_blank", "_parent", "_search", "_top".
You can also set a frame name.
|
| var statusString = "tip";
|
Text in a browser's status bar when you put a pointer over an item. Values:
"link" - show item link;
"text" - show item text;
"tip" - show item tip.
With another value shows specified value.
|
| var blankImage = "images/blank.gif";
|
Path to a blank image.
Usually it's a GIF image with a transparent background, size 1x1 px.
|
|
|
|
Dimensions
|
|
| var menuWidth = '400px';
|
Width of the menu in (px, % or other units).
It's recommended to assign a precise value to this parameter for a correct menu positioning in different browsers.
|
| var menuHeight = "40px";
|
Height of the menu in (px, % or other units).
|
| var smWidth = 200;
|
Width of all submenus.
|
| var smHeight = 500;
|
Height of all submenus.
|
|
|
|
Positioning
|
|
| var absolutePos = 1;
|
0 - relative menu javascript position (for example, menu can be placed inside a table);
1 - absolute menu position (menu uses absolute coordinates on a page).
|
var posX = 100;
var posY = 100;
|
X and Y coordinates of a top-left corner of the menu.
Works if var absolutePos = 1;
You can set values in px or % (e.g. 100, "30px", "50%").
|
var topDX = 0;
var topDY = 0;
|
X and Y offsets for 1st-level submenus.
|
var DX = -3;
var DY = 0;
|
X and Y offsets for submenus.
|
| var subMenuAlign = "left";
|
Horizontal alignment for submenus.
"left", "center", "right" - alignment relative to the parent item;
"pleft", "pcenter", "pright" - alignment relative to the parent submenu.
|
| var subMenuVAlign = "top";
|
Submenus vertical alignment.
"top", "center", "bottom" - alignment relative to the parent item;
"ptop", "pcenter", "pbottom" - alignment relative to the parent submenu.
|
|
|
|
Font
|
|
| var fontStyle = "bold 9pt Verdana";
|
Font style.
|
| var fontColor = ["#444444","#FFFFFF"];
|
Normal and mouseover font colors.
|
| var fontDecoration = ["none","underline"];
|
Normal and mouseover font decoration.
Available values: "none", "underline", "line-through", "overline".
|
| var fontColorDisabled = "#AAAAAA";
|
Font color for a disabled item.
The item is disabled when its target is "_".
|
|
|
|
Appearance
|
|
| var menuBackColor = "#FFFFFF";
|
Background color of the menu and all the submenus.
|
| var menuBackImage = "back.gif";
|
Background image for the menu and all the submenus.
|
| var menuBackRepeat = "repeat-x";
|
Repeating of background of the menu and all the submenus.
Available values: "repeat", "repeat-x", "repeat-y", "no-repeat".
|
| var menuBorderColor = "#CCCCCC";
|
Border color of the menu and all the submenus.
|
| var menuBorderWidth = 1;
|
Border width for the menu and all the submenus.
|
| var menuBorderStyle = "solid";
|
Border style for the menu and all the submenus.
Available values: "none", "solid", "double", "dotted", "dashed", "groove", "ridge".
|
|
|
|
Item Appearance
|
|
| var itemBackColor = ["#FFFFFF","#4792E6"];
|
Normal and mouseover colors of item background.
|
| var itemBackImage = ["back1.gif","back2.gif"];
|
Normal and mouseover images of items' background.
|
| var beforeItemImage = ["left_n.gif","left_o.gif"];
|
Left-side images for normal and mouseover states.
|
| var afterItemImage = ["right_n.gif","right_o.gif"];
|
Right-side images for normal and mouseover states.
|
| var beforeItemImageW = "";
|
Width of the left-side image.
|
| var afterItemImageW = "";
|
Width of the right-side image.
|
| var beforeItemImageH = "";
|
Height of the left-side image.
|
| var afterItemImageH = "";
|
Height of the right-side image.
|
| var itemBorderWidth = 0;
|
Width of items' border.
|
| var itemBorderColor = ["#6655FF","#665500"];
|
Normal and mouseover colors of items' border.
|
| var itemBorderStyle = ["solid","dotted"];
|
Normal and mouseover styles of items' border.
Available values: "none", "solid", "double", "dotted", "dashed", "groove", "ridge".
|
| var itemAlignTop = "left";
|
Text alignment for top items.
Values: "left", "center", "right".
|
| var itemAlign = "left";
|
Text alignment for submenu items.
Values: "left", "center", "right".
|
| var itemSpacing = 0;
|
Item spacing.
|
| var itemPadding = "4px";
|
Item padding.
You can also set multiple values, for example:
"10px 15px 10px 5px";
(top, right, bottom, left)
|
|
|
|
Floatable Menu
|
|
| var floatable = 1;
|
Creates a floatable menu - when the page is scrolled the menu remains visible.
0 - disabled, 1 - enabled.
|
var floatableX = 1;
var floatableY = 1;
|
Set a floatable ability for the menu along X and Y axes.
0 - disabled, 1 - enabled.
|
| var floatIterations = 6;
|
Sets a floatation speed. The less the value is the more the speed is.
|
|
|
|
Movable Menu
|
|
| var movable = 0;
|
Creates a movable menu - you can use a mouse to move a menu as a usual window.
|
| var moveCursor = "move";
|
Cursor type when you mouseover the drag spacer.
|
| var moveImage = "move.gif";
|
Image of the drag spacer.
|
var moveWidth = 12;
var moveHeight = 24;
|
Width and height of the drag spacer.
|
| var moveColor = "#AA0000";
|
Background color of the drag spacer.
|
| var smMovable = 0;
|
Enables MS Office toolbar-like mode - you can drag submenus and separate them from the parent ones.
|
| var closeBtn = "btn_image.gif";
|
Image for a close-button for submenus.
|
var closeBtnW = 15;
var closeBtnH = 15;
|
Width and height of a close-button.
|
|
|
|
Icons
|
|
var iconTopWidth = 24;
var iconTopHeight = 24;
|
Width and height of icons for top-level items.
|
var iconWidth = 16;
var iconHeight = 16;
|
Width and height of icons for submenu items.
|
| var arrowImageMain = ["img1.gif","img2.gif"];
|
Normal and mouseover arrow images for top-level items.
|
| var arrowImageSub = ["arrow1.gif","arrow2.gif"];
|
Normal and mouseover arrow images for submenu items.
|
var arrowWidth = 9;
var arrowHeight = 9;
|
Width and height of arrow icons.
|
|
|
|
Transitional Effects & Filters
|
|
| var transparency = 75;
|
Transparency of submenu in %.
|
| var transition = 3;
|
Index of a transitional effect (0-39).
|
| var transOptions = "options_string";
|
Additional parameters for transitional effects with var transition > 24;
|
| var transDuration = 300;
|
Delay of a transitional effect (in ms) on submenu's showing.
|
| var transDuration2 = 200;
|
Delay of a transitional effect (in ms) on submenu's hiding.
|
| var shadowColor = "#777777";
|
Shadow color.
|
| var shadowLen = 3;
|
Length of shadow.
|
| var shadowTop = 1;
|
A shadow for a top-menu: 0 - hide, 1 - show.
|
|
|
|
Separators
|
|
| var separatorImage = "img.gif";
|
Separator's image.
|
| var separatorWidth = "100%";
|
Width of a horizontal separator (in px, %).
|
| var separatorHeight = 3;
|
Height of a horizontal separator (in px).
|
| var separatorAlignment = "right";
|
Alignment of a horizontal separator.
|
| var separatorVImage = "img.gif";
|
Vertical separator's image.
|
| var separatorVWidth = 5;
|
Width of a vertical separator (in px).
|
| var separatorVHeight = 16;
|
Height of a vertical separator (in px, %).
|
| var separatorPadding = "5px";
|
Separators' padding.
You can also set multiple values, for example:
"10px 15px 10px 5px";
(top, right, bottom, left)
|
|
|
|
CSS Support (CSS-based Menu)
|
|
| var cssStyle = 0;
|
Enables CSS mode. CSS mode allows you to use your own CSS styles for all components of the menu.
0 - disabled (default), 1 - enabled.
|
| var cssSubmenu = "class";
|
CSS class name for submenus.
|
| var cssItem = ["classNormal","classOver"];
|
Normal and mouseover CSS class names for items.
|
| var cssItemText = ["classNormal","classOver"];
|
Normal and mouseover CSS class names for a text of items.
|
|
|
|
Advanced
|
|
| var dmObjectsCheck = 0/1;
|
Checking of intersection with selects, iframes, flash movies, etc.
0 - disabled (default), 1 - enabled.
|
| var pathPrefix_img = "mydomain.com/images/";
|
Path prefix for menu images.
This string will be added for all image paths in the menu javascript.
|
| var pathPrefix_link = "mydomain.com/content/";
|
Path prefix for menu links.
This string will be added for all links in the menu.
|
| var saveNavigationPath = 1;
|
The menu keeps items highlighted during menu navigation.
0 - disabled, 1 - enabled (default).
|
| var showByClick = 0;
|
Show submenus on a mouse click only.
0 - disabled (default), 1 - enabled.
|
| var noWrap = 1;
|
A wordwrap for items' text.
0 - disabled, 1 - enabled (default).
|
| var smHidePause = 1000;
|
A delay (in ms) between mouse is moved from submenu and its closing.
You can make submenus to stay visible till you click outside the menu or scroll your page.
To enable this feature you should set this parameter in the following way: var smHidePause = -1;
|
| var smShowPause = 200;
|
When mouse pointer is over the menu item - a delay (in ms) after that submenu will be shown .
|
| var smSmartScroll = 1;
|
Submenus smart scrolling.
0 - disabled, 1 - enabled (default).
|
| var topSmartScroll = 1;
|
Top menu items smart scrolling (works if var menuWidth isn't empty).
0 - disabled, 1 - enabled (default).
|
| var smHideOnClick = 1;
|
Hide all submenus on item click.
0 - disabled, 1 - enabled (default).
|
| var dm_writeAll = 0;
|
It's recommended to set this parameter to 1 when you're modifying your menu "on-the-fly" using Javascript API (var dynamic=1).
Set it to 0 if you have a big menu - it'll increase loading speed.
Default is 0.
|
| var useIFRAME = 0;
|
Always use iframe with the menu. It helps to overlap objects correctly.
0 - disabled (default), 1 - enabled.
|
| var dmSearch = 0;
|
Possibility to add search bar in the menu. To add it set item's link to "search:" and variable dmSearch=2;
Available values: 0-nosearch; 1-ordinary search (within one level of submenus only); 2-recursive (within the whole menu);
|
|
|
|
AJAX-like Technology (new! v2.0)
|
|
| var dmAJAX = 0;
|
AJAX-like technology allows to load data for submenus "on-the-fly" from the server. It's necessary to set exact value for var dmAJAXCount when using this technology.
0 - disabled (default), 1 - enabled.
Supported browsers (Windows OS):
IE5+, Firefox, Mozilla, Netscape 7+, Opera 8+.
|
| var dmAJAXCount = 20;
|
Maximal number of submenus that will be loaded from server.
Default is 0.
|
|
|
|
Dynamic Menu (Javascript API)
|
|
| var dynamic = 0;
|
Deluxe Menu has external Javascript functions that allow you to change the menu "on the fly".
To enable these functions set the parameter to 1.
Dynamic functions are placed in dmenu_dyn.js file.
|
|
|
|
Keystrokes Support
|
|
| var keystrokes = 0;
|
Enable keystrokes support.
0 - disabled (default), 1 - enabled.
Ctrl+F2 - enter the menu/switch to next menu on the page.
Arrow keys - navigate.
Enter - enter the menu.
Esc - exit the menu.
|
| var dm_focus = 1;
|
Show focus selection for selected item.
|
| var dm_actKey = 113;
|
Key code for keystrokes activation.
Works with Ctrl key only.
Default value is 113 = F2 key, 114 = F3 key, 115 = F4 key, etc.
|
|
|
|
Popup Mode (Context Menu)
|
|
| var popupMode=1;
|
Create popup menu.
Assign the code in the following format to the object's event to show the menu:
return dm_popup(menuInd, pause, event, x, y)
For example:
<img onClick="return dm_popup(0, 1000, event)">
|
|
|
|
Responsive Menu
JustAjax
What's New
Features
Installation
Deluxe Tuner GUI
Javascript API
Description of Files
Supported Browsers
Customization
Parameters
Menu Items
Individual Item Styles
Individual Submenu Styles
Functional Samples
AJAX Menu
Templates
Android Dark Menu Template
Trial Version
License Agreement
Buy Deluxe Menu
Order Non-profit License
License Types
Non-profit License
Single Site License
Developer & Enterprise
FAQ
Contacts
Customization
