Definition of Menu Position

CodeThatMenu supports an ability of absolute and relative positioning for menu.

"position" : {
	"absolute" : true, "pos" : [200, 40]
}

In this example the menu is created with absolute positioning and we put it at the point (200, 40). When "absolute" property is set in false, it means the menu is created with relative positioning.

CodeThatManu allows you to customize different positioning for submenus (relatively to higher menu). It means you can set a point on the higher menu to which you attach a submenu:

"nw" - top-left corner,

"ne" - top-right corner,

"se" - bottom-right corner,

"sw" - bottom-left corner,

"n/s/e/w" - middles of appropriate sides.

For this purpose the "anchor" property is used.

You also can specify the corner or side of sub-menu, which will be sticked to higher menu (n, s, w, e, nw, ne, sw, se). For this purpose the "anchor_side" property is used.

You can specify custom value for sub-menu offset by using "menuoffset" property.

To specify sub-menu position use the folowing construction:

"items" : [
{
	"text" : "Item 1",
	"menu" : {
		"style" : {
			"direction" : "v"
		},
		"position" : {
			"anchor" : "s",
			"anchor_side" : "nw",
			"menuoffset" : {
				"x" : "0", "y" : "3"
			}
		}

Example - Menu Positioning

You can see an example and complete code here - Menu Positioning Example

Read more about CodeThatMenu >>