Examples
Examples - Other Features
This page shows the usage of other useful WebDDM features that are great, but aren't complex/great enough to have a page dedicated to them.
Examples - Open/close delay
This feature may not be for everybody, but it can be very useful at times.
You can assign open/close delays for menus like this:

    1:{
    	// define menu open delay, in milliseconds
    	'openDelay':500,

    	// define menu close delay, in milliseconds
    	'closeDelay':1000,

    	// other item properties...
    }

An example of this can be seen with the "More Info" submenu.
Setting actions
You can specify code that will be executed when certain events occur. Possible events:

- onmouseover - Code to be executed when the mouse moves over the item.
- onmouseout - Code to be executed when the mouse moves off the item.
- onclick/onmouseup/onmousedown - Code to be executed when an item is clicked on.
- onmousemove - Code to be executed when the mouse is moved over the item.

When writing code, you can use the "in_event" variable for the event object.
Example:

    1:{
    	// Code for the item....

    	// Action handlers for the item....
    	'actions':{
    		'onmouseover':'window.status="example";',
    		'onmouseout':'window.status=window.defaultStatus;'
    	}
    }

Check out the status bar when your mouse is over the "More Info" submenu.
Setting the z-index
If you want to change the default z-index of your menu/menu items, it's easy to configure. To set the z-index of the base menu:

    var menu = {
    	// Initialize menu...

    	// Set z-index
    	'zIndex':1000,

    	// End menu...
    };

In the past you could set individual zIndexes for items, but this feature was pointless and often led to confusion, so it has been removed.
If you set the zIndex, the changes will apply to all menus and tooltips.
Always preload your images!
One way to make menus more pleasing it to preload ALL images used in your menu, right away. It's very simple to do this:

    WebDDM_preloadImages('menus/mainmenu/arrowdown.gif',
    	'menus/mainmenu/arrowleft.gif', 'path/to/another.image', 'etc');

View Source
View CSS file - View JavaScript file.
Examples
Examples: Last - Next