Introduction

With CodeThatMenu you can

create drop-down, popup and  toolbar (unique feature of CodeThatMenu) menus for hierarchical menu

customize style for whole submenus and individual items:

background colors, background images, shadows, borders are supported

images in menu items are supported (both for plain items and submenus)

 alignment support

menu appearance (and individual items) can be controlled through the CSS class

use menu separators

 define items opacity

use a timer to determine delay when submenu is visible after mouse over event

 describe the vertical or horizontal bar at the menu

define menu position:

different positioning for submenus (relatively to higher menu) is supported

support for absolute and  relative positioning

define the action to be excuted when the item is cliked

 change menu structure and appearance at run-time

 create menu with unlimited depth where all levels independently configurable

 describe menu configuration in xml-file (unique feature of CodeThatMenu)

include almost any HTML code as menu's item

generate menu script from the database

build menu in the frame

specify custom borders for menu

use many other additional features

 Read Standard vs PRO to know the differences between CodeThatMenu Standard and PRO.

The configuration of the menus can be stored in the separate js file.

To describe new menu (main or pop-up) create an object with following structure:

	var MenuDef = {
		"style" : {},
		"itemover" : {},
		"position" : {},
		"separator" : {},
		"defaction" : {},
		"items" : []
	};

where

	items - submenu items
	style - menuitem/box style
	itemover - menuitem style when in "mouseover" state
	position - menu position (either relative or absolute)
	defaction - specifies the default action parameters

To describe hierarchical menu use "type" property for specifying special menu style ("popup"/"bar"/"toolbar").

To describe an item use following structure:

	"items" : [ {
		"text" : " ",     // text to be written inside
		"style" : {},     // item style in normal state
		"styleover" : {}, // item style in "mouse over" state
		"styleon" : {},   // for bool items specifies the style
		                  // when in "on" state
		"menu" : {},      // submenu
		"action" : {},
		"position" : {},
		"type" : " "      // special item type ("bool"/"separator"),
		                  // for hierarchical menu only
	} ]

For the hierarchical menu only you can use addition properties:

type - special item type ("bool"/"separator")

value - value of the item (supposed to be used when type is "bool")

Read more about CodeThatMenu >>