Options class (Menu)

The align field horizontally aligns the item's caption. The align property can be any of the following values:

• -1 {number}, specifies that the item's caption full-fits the item's background. You can use the or ex-HTML tags to align portions of caption inside the item
• 0 {number}, indicates that the caption is left-aligned
• +1 {number}, specifies that the caption is centered
• +2 {number}, specifies that the caption is right-aligned

.

2 {number}, right aligns the item's caption

The alignClient field specifies whether the item's client position is aligned to sub-item client position, when a float-menu is displayed.

false {boolean}, specifies that the item and its sub-items are not vertically aligned (when a popup is opened)
  true {boolean}, specifies that the item and its sub-items are vertically aligned (when a popup is opened)

The alignContextMenu field defines the horizontal and vertical position of the context/shortcut-menu relative to the x, y coordinates. Indicates the horizontal and vertical position of the context/shortcut-menu relative to the x, y coordinates. The Menu.AlignContextMenuEnum type defines the following flags:

• exLeftAlign (0x00), positions the shortcut menu so that its left side is aligned with the coordinate specified by the x parameter
• exCenterAlign (0x04), centers the shortcut menu horizontally relative to the coordinate specified by the x parameter
• exRightAlign (0x08), positions the shortcut menu so that its right side is aligned with the coordinate specified by the x parameter
• exTopAlign (0x00), positions the shortcut menu so that its top side is aligned with the coordinate specified by the y parameter
• exVCenterAlign (0x10), centers the shortcut menu vertically relative to the coordinate specified by the y parameter
• exBottomAlign (0x20), positions the shortcut menu so that its bottom side is aligned with the coordinate specified by the y parameter

The alignContextMenu property has effect only, if the control is opened as a context-menu, using the Open() method.

0 or Menu.AlignContextMenuEnum.exLeftAlign | Menu.AlignContextMenuEnum.exTopAlign {number}, the context-menu is shown aligned to x and y properties
  20 or Menu.AlignContextMenuEnum.exCenterAlign | Menu.AlignContextMenuEnum.exVCenterAlign {number}, centers the context-menu relative to x and y properties
  32 or Menu.AlignContextMenuEnum.exLeftAlign | Menu.AlignContextMenuEnum.exBottomAlign {number}, opens the context-menu right to the x and y properties

The allowToggleRadio field allows or prevents toggling the radio state.

false {boolean}, no radio-item toggles its state (once the user clicks a checked radio-item, it stays checked (state on 1))
  true {number}, any radio-item toggles its state (once the user clicks a checked radio-item, it gets unchecked (state on 0))

The arrSize field specifies the size (width and height) to show the item's arrow. The item's arrow is displayed only for popup-items, or items that contains sub-items or child-items.

0 {number}, indicates that no arrow is shown
 6 {number}, indicates that the arrow is displayed into a square of 6x6 pixels

The arrangeItemsAs field specifies how the items are arranged on the control (top-level menu). A combination of one or more ArrangeItemsEnum flags that specifies how the items are arranged on the control (top-level menu). The Menu.ArrangeItemsEnum type supports the following flags:

• exArrangeItemsHorizontal (1), specifies that the items are horizontally arranged from left to right
• exArrangeItemsVertical (2), specifies that the items are vertically arranged from top to bottom
• exArrangeItemsHideTopArrow (0x10), indicates that the arrow for any top-item is not visible (not valid for float-menu)
• exArrangeItemsPopupAlign (0x20), specifies that the item's float/popup-menu should be displayed to prevent overlapping other items
• exArrangeItemsWrap (0x100), wraps items on a new row/column (not valid for float-menu)
• exArrangeItemsScroll (0x200), specifies that the control's scroll bar is displayed if required
• exArrangeItemsAlignCenter (0x400), centers the items on each row/column
• exArrangeItemsAlignReverse (0x800), reverses the alignment of the items

.

561 or Menu.ArrangeItemsEnum.exArrangeItemsHideTopArrow | Menu.ArrangeItemsEnum.exArrangeItemsHorizontal | Menu.ArrangeItemsEnum.exArrangeItemsScroll | Menu.ArrangeItemsEnum.exArrangeItemsPopupAlign {number}, arranges horizontally all items of top-level menu

The btnArrSize field specifies the size (width and height) to show the button's arrow. The item's arrow is displayed only items that contains sub-items or child-items, while it is of [button] type.

0 {number}, indicates that no arrow is shown for an item of button type ([button])
 6 {number}, indicates that the arrow is displayed into a square of 6x6 pixels

The btnPad field defines the button's padding (space between the button border and the item content). A value that could be a numeric value, to pad horizontal and vertical size with the same value, or a "x,y" or [x,y] type to specify the padding on h/v size.

4 {number}, increases the object's client with 2 * 4-pixels, which includes width and height
  "8,4" {string}, increases the object's width with 2 * 8-pixels and object's height with 2 * 4-pixels
  [8,4] {array}, increases the object's width with 2 * 8-pixels and object's height with 2 * 4-pixels

The close field defines the time in ms the sub-menu is closed once the cursor hovers the top-level item. The value of close property can be any of the following:

• if positive, indicates the time in ms the sub-menu is closed once the cursor hovers the top-level item.
• if 0, indicates that the sub-menu is closed as soon as the cursor hovers a top-level item
• if negative, it has no effect

.

0 {number}, indicates that the sub-menu is closed as soon as the cursor hovers a top-level item.
 350 {number}, the sub-menu is closed once 350 ms ellapsed after the cursor hovers a top-level item.

The closeOnClick field defines the type of items the user can click to close the float-menu(s). Indicates a combination of one or more Menu.CloseOnClickEnum flags that specifies the type of items the user can click to close the float-menu(s). The Menu.CloseOnClickEnum type defines the following flags:

• exCloseOnDefault (0), indicates that the float-menu is closed once the user clicks an enabled item with no check, radio or button associated
• exCloseOnDisabled (1), specifies that the float-menu is closed once the user clicks a disabled item
• exCloseOnSeparator (2), specifies that the float-menu is closed once the user clicks a separator item
• exCloseOnButton (4), specifies that the float-menu is closed once the user clicks an item of button-type
• exCloseOnCheck (8), specifies that the float-menu is closed once the user clicks an item of check-type
• exCloseOnRadio (16), specifies that the float-menu is closed once the user clicks an item of radio-type
• exCloseOnState (24), specifies that the float-menu is closed once the user clicks an item of check or radio-type
• exCloseOnAny (-1), specifies that the float-menu is closed once the user clicks any type of item anywhere

.

0 or Menu.CloseOnClickEnum.exCloseOnDefault {number}, specifies that the float-menu is closed once the user clicks an enabled item with no check, radio or button associated
  -1 or Menu.CloseOnClickEnum.exCloseOnAny {number}, specifies that the float-menu is closed once the user clicks any type of item anywhere

The criAlign field specifies whether the check-box/radio-button or the item's image are vertically aligned. The criAlign property has effect, if the control's criFlat is exNormal.

false {boolean}, check-box/radio-button or the item's image is not vertically aligned
 true {boolean}, check-box/radio-button or the item's image is vertically aligned

The criFlat field indicates whether the menu's flat bar is shown or hidden. The Menu.FlatEnum type supports the following values:

• exNormal (0), indicates that the menu's flat bar is not shown
• exShowFlat (1), indicates that the menu's flat bar is visible only if the menu contains items with check, radio or image
• exAlwaysFlat (2), indicates that the menu's flat bar is always visible

.

2 or Menu.FlatEnum.exAlwaysFlat {number}, defines a flat-menu

The criPad field indicates the padding to apply to a check-box/radio-button or the item's image. A value that could be a numeric value, to pad horizontal and vertical size with the same value, or a "x,y" or [x,y] type to specify the padding on h/v size.

4 {number}, increases the object's client with 2 * 4-pixels, which includes width and height
  "8,4" {string}, increases the object's width with 2 * 8-pixels and object's height with 2 * 4-pixels
  [8,4] {array}, increases the object's width with 2 * 8-pixels and object's height with 2 * 4-pixels

The criSize field specifies the size (width and height) to show a check-box/radio-button or the item's image.

16 {number}, indicates that any check-box, radio or image uses a 16x16 rectangle to display it within the item

The cursors field specifies the mouse cursor to be displayed when pointing over a part of the control. The format of cursors property is:

"cursor(part),cursor(part),..."

where:

• "cursor", defines the CSS mouse cursor to display while cursor hovers the part
• "part", defines the name of the part the cursor is applied on (as defined below)

The cursors property supports any of the following parts:

• "menu" (menu), defines the mouse-cursor to show when the mouse pointer hovers the entire menu
• "flat" (flat), defines the mouse-cursor to show when the mouse pointer hovers menu's flat bar (usually shown in the left side of the menu)
• "sep" (separator), defines the mouse-cursor to show when the mouse pointer hovers the separator-items
• "item" (item), defines the mouse-cursor to show when the mouse pointer hovers the item's background. It covers all parts of the item as check, image, caption/button, popup arrow and sub-items
• "sub" (sub-items), defines the mouse-cursor to show when the mouse pointer hovers the sub-items of the item (while the item is grouped)
• "arr" (arrow), defines the mouse-cursor to show when the mouse pointer hovers the item's arrow (while the item contains un-grouped sub-items)
• "cap" (caption), defines the mouse-cursor to show when the mouse pointer hovers the item's caption
• "img" (image), defines the mouse-cursor to show when the mouse pointer hovers the item's image
• "chk" (check), defines the mouse-cursor to show when the mouse pointer hovers the item's check-box
• "rad" (radio), defines the mouse-cursor to show when the mouse pointer hovers the item's radio-button
• "btn" (button), defines the mouse-cursor to show when the mouse pointer hovers the buttons
• "rarr" (right-arrow), defines the mouse-cursor to show when the mouse pointer hovers the button's arrow (to right)
• "barr" (bottom-arrow), defines the mouse-cursor to show when the mouse pointer hovers the button's arrow (to bottom)
• "anchor" (hyperlink), defines the mouse-cursor when the mouse pointer hovers the anchor (the <a id;options> ex-HTML part marks an anchor or hyperlink element) (@since 2.2)

.

"" {string}, no mouse cursor support
  "pointer(chk,rad,btn)" {string}, indicates that the "pointer" mouse cursor is shown once the cursor hovers the "chk", "rad" or "btn" parts of the control

The debug field indicates whether the control displays debug-information.

false {boolean}, no debug-information is displayed
  true {boolean}, debug-information is displayed for each item (usually the item's identifier)

The items field defines the items of the menu from a string-representation. Indicates the items the control. The format of the items'string representation is (everything between () refers to children, and everything between [] refers to flags):

"item1[flag=value]...[flag=value](sub-item1[flag=value]...[flag=value],...,sub-itemn[flag=value]...[flag=value]),...,itemn[flag=value]...[flag=value](sub-item1[flag=value]...[flag=value],...,sub-itemn[flag=value]...[flag=value])"

The string-representation supports the following flags:

• [id], specifies the item's identifier, such as [id=10].
• [align] {number}, horizontally aligns the caption. The align could be -1(full-fits the item), 0(left-alignment), 1(center), or 2( right-alignment) such as [align=2] right-aligns the item.
• [pad], specifies the item's padding (space between the menu border and the item content). The pad could be one or two numbers, separated by comma, such as [pad=2] or [pad=2,2]
• [itemsPad], specifies the items padding (space between the menu border and the item content). The itemsPad could be one or two numbers, separated by comma, such as [itemsPad=2] or [itemsPad=2,2]
• [chk], indicates that the item has a check-box associated. If the [typ] flag is present, the [chk] flag indicates the state of the item, and the [rad] flag is ignored. The chk could be 0 or 1, such as [chk] or [chk=0] for a un-checked item, or [chk=1] for checked item.
• [rad], indicates that the item has a radio-button associated. If the [typ] flag is present, the [chk] flag indicates the state of the item, and the [rad] flag is ignored. The rad could be 0 or 1, such as [rad] or [rad=0] for a un-checked item, or [rad=1] for checked item.
• [typ], specifies the type of the item, that can be normal, check or radio. The typ could be 0(normal item), 1(items that display a check/box (chk)) or 2(items that display radio buttons (rad)). If the [typ] flag is present, the [chk] flag indicates the state of the item, and the [rad] flag is ignored. For instance [typ=1], specifies a check-box item
• [grp], defines the radio group. It should be used when you define more groups of radio buttons. A group of radio buttons means that only one item could be checked at one time. The rad option specifies that the item displays a radio button. Use the grp option to define the group of radio where this button should be associated, If no group of radio buttons is required, the grp could be ignored. For instance, [grp=sample]
• [img], indicates that the item's image. The img indicates the name of an exontrol.HP, such as [img=logo]
• [group], specifies how the sub-items are being grouped. The group could be a flag combination of Menu.GroupPopupEnum type, such as [group] to group horizontlly the item, or [group=0x100] to group vertically the items
• [arrow], indicates whether the item's popup-arrow is shown or hidden. The arrow could be 0 to hide the arrow, or not-zero to show the arrow, such as [arrow] or [arrow=0] to hide the arrow, or [arrow=1] to show the arrow
• [hid], hides/shows the item. The hid could be 0 which indicates that the item is hidden. Any other value makes the item visible, such as [hid] or [hid=0] to hide the item, or [hid=1] to show the item
• [captionWidth] or [cw], specifies the width to show the HTML caption of the item, where value could be a integer expression. A negative value indicates that no limitation is applied to the item's caption, so no truncate caption is shown. For instance [cw=128]
• [captionHeight] or [ch], specifies the height to show the HTML caption of the item, where value could be a integer expression. A negative value indicates that no limitation is applied to the item's caption, so no truncate caption is shown. For instance [ch=128]
• [height], specifies the height to display the item, where value could be a integer expression (it applies to all parts of the item). For instance [height=64]
• [width], specifies the width to display the item, where value could be a integer expression (it applies to all parts of the item). For instance [width=64]
• [button], associates a button with the item. The value could be a flag combination of Menu.ShowAsButtonEnum type, such as [button] or [button=1] makes the item to display a button, or [button=0] disables displaying any button.
• [spchk], indicates whether the sub-items/popup of giving item are shown when the item is checked. The value could be 0, which indicates that it has no effect, or non-zero to show the sub-item when the item is checked. For instance [spchk]
• [show], specifies how an item that has a check-box/radio-button should be displayed. The value could be any value of Menu.ShowCheckedAsSelectedEnum type. For instance [show=-1] (the exDisplayItemCheckHighlight value highlights the checked item)
• [showdis], makes the item to show as disabled, while it is still enabled. The flag is applied to all descendents. Any value not-zero indicates that the item is shown as disabled. For instance [showdis]
• [tab], indicates the identifier of the item that displays the sub-items of the current item. For instance: [tab=page] or [tab=1]
• [dis], disables the item. The flag is applied to all descendents. Any value not-zero indicates that the item is enabled. For instance [dis]
• [sep], specifies an separator item, such as [sep]. The value is ignored if provided. For instance [sep]
• [popupalign] or [pa], indicates how the sub-menu/popup/float is aligned relative to the parent item (Menu.ShowPopupAlignEnum). For instance [pa=1] (The exShowPopupAlignDown value indicates that the sub-menu/popup is shown down-aligned relative to the parent item)
• [shapes], specifies the shapes to be applied on the item only. For instance [shapes=dfitem(item),dfcap(cap)]
• [cursors], defines the mouse cursor to be displayed when pointing over a part of the item only. For instance [cursors=pointer(item)]
• [close], specifies whether clicking the item closes the float-menu (Menu.CloseOnClickEnum). For instance [close=-1], closes the context-menu once the user clicks the items (no matter, if it is of check, radio or button type)

.

"" {string}, clears the items collection
 "Popup(A,B,C)" {string}, adds a popup-item with three sub-items A, B and C
 "Popup[group](A,B,C)" {string}, adds an item with three sub-items A, B and C, and all items are visible and displayed as an horizontally group
 "Popup[group][chk][spchk](A,B,C)" {string}, adds an item with three sub-items A, B and C, but A, B and C sub-items are visible and displayed only if the popup is checked

The itemsPad field defines the padding the sub-items section of the item (space between the menu border and the items content). A value that could be a numeric value, to pad horizontal and vertical size with the same value, or a "x,y" or [x,y] type to specify the padding on h/v size.

4 {number}, increases the object's client with 2 * 4-pixels, which includes width and height
  "8,4" {string}, increases the object's width with 2 * 8-pixels and object's height with 2 * 4-pixels
  [8,4] {array}, increases the object's width with 2 * 8-pixels and object's height with 2 * 4-pixels

The locked field indicates whether the control is locked(protected) or unlocked.

false {boolean}, unlocks the control (can select any item)
  true {boolean}, locks the control (can't select any item)

The open field defines the time in ms the top-level item opens its sub-menu once the cursor hovers it. The value of open property can be any of the following:

• if positive, indicates the time in ms the top-level item opens its sub-menu once the cursor hovers it.
• if 0, indicates that the top-level item opens its sub-menu as soon as cursor hovers it
• if negative, indicates that the item requires click to to open its sub-menu

.

0 {number}, indicates that the top-level item opens its sub-menu as soon as cursor hovers it.
 -1 {number}, indicates that the top-level item opens its sub-menu as soon as user clicks it.

The outClose field defines the time in ms the control closes all its float-menu as soon as the cursor hovers outside portion of the menu. The value of outClose property can be any of the following:

• if positive, specifies the time in ms the control closes all its float-menu as soon as the cursor hovers outside portion of the menu
• if 0, indicates that the menu's floats are closed as soon as the cursor hovers outside portion of it
• if negative, it has no effect

.

0 {number}, indicates that the menu's floats are closed as soon as the cursor hovers outside portion of it
 350 {number}, the control's float-menus are closed once 350 ms ellapsed after the cursor hovers outside portion of the menu

The pad field defines the item's padding (space between the menu border and the item content). A value that could be a numeric value, to pad horizontal and vertical size with the same value, or a "x,y" or [x,y] type to specify the padding on h/v size.

4 {number}, increases the object's client with 2 * 4-pixels, which includes width and height
  "8,4" {string}, increases the object's width with 2 * 8-pixels and object's height with 2 * 4-pixels
  [8,4] {array}, increases the object's width with 2 * 8-pixels and object's height with 2 * 4-pixels

The popupRatio field defines a positive number that specifies the maximum ratio of the document's view page, a float or a popup menu can be shown. For instance, 1/2 indicates that the width / height of the float-menu can not exceed half of the width / height of the document's view page.

0 {number}, indicates that the size of the float-menu is not influenced by the document's view size, so it will be displayed entirely as it is
  0.5 {number}, indicates that the width / height of the float-menu can not exceed half of the width / height of the document's view page (control's scroll is automatically added if exArrangeItemsScroll flag is specified)

The readOnly field indicates whether the control is read-only.

false {boolean}, the user can select or check any item
  true {boolean}, the user can not select or check the items

The scrollClip field specifies whether the control's scroll bar is clipped.

false {boolean}, the scroll is not clipped, so it is shown over the menu
 true {boolean}, the scroll and items portions of the menu are separatly

The scrollOpt field specifies the options (UI visual appearance, behavior) to display the control's scroll bar.

The scrollSize field specifies the size (width/height) of the control's scroll bar.

0 {number}, hides the menu's scroll-bar but scrolling it is still posible by drag. Click an item and drag outside the margins so the menu gets scrolled
 4 {number}, defines a 4-pixels wide scroll bar

The sepSize field specifies the size to show a separator item.

0 {number}, hides all separator items ([sep])
 4 {number}, specifies the separator items of 4-pixels size

The shapes field defines the shapes each part of the control can display. The shapes field customizes the control's visual appearance. A string expression that defines the shapes each part of the control can display. The format of shapes property is:

"shape(part),shape(part),..."

where:

• "shape", defines the shape to apply on the UI part as one of the following:

  ◦ any of 140 color names any browser supports (such as red, blue, green, ...)
  ◦ hexadecimal colors, is specified with: #RRGGBB, where the RR (red), GG (green) and BB (blue) hexadecimal integers specify the components of the color. All values must be between 00 and FF (such as #0000ff which defines a blue background)
  ◦ hexadecimal colors with transparency, is specified with: #RRGGBBAA, where AA (alpha) value must be between 00 and FF (such as #0000ff80 which defines a semi-transparent blue background)
  ◦ RGB colors, is specified with the RGB(red, green, blue) function. Each parameter (red, green, and blue) defines the intensity of the color and can be an integer between 0 and 255( such as rgb(0,0,255) that defines a blue background)
  ◦ RGBA colors, are an extension of RGB color values with an alpha channel as RGBA(red, green, blue, alpha) function, where the alpha parameter is a number between 0.0 (fully transparent) and 1.0 (fully opaque) ( such as rgba(0,0,255,0.5) which defines a semi-transparent blue background)
  ◦ HSL colors, is specified with the HSL(hue, saturation, lightness) function, where hue is a degree on the color wheel (from 0 to 360) - 0 (or 360) is red, 120 is green, 240 is blue. saturation is a percentage value; 0% means a shade of gray and 100% is the full color. lightness is also a percentage; 0% is black, 100% is white. HSL stands for hue, saturation, and lightness - and represents a cylindrical-coordinate representation of colors (such as hsl(240, 100%, 50%) that defines a blue background)
  ◦ HSLA colors, are an extension of HSL color values with an alpha channel - which specifies the opacity of the object as HSLA(hue, saturation, lightness, alpha) function, where alpha parameter is a number between 0.0 (fully transparent) and 1.0 (fully opaque) (such as hsla(240, 100%, 50%,0.5) that defines a semi-transparent blue background)
  ◦ a JSON representation of the shape object to apply (while it starts with { character, such as '{"normal": {"primitive": "RoundRect","fillColor":"black","tfi": {"fgColor": "white"}}}')
  ◦ specifies the name of the field within the exontrol.Shapes.Menu object (while it starts with a lowercase letter, such as dfitem which refers to exontrol.Shapes.Menu.dfitem shape)
  ◦ specifies the name of the field within the exontrol.Shapes object (while it starts with an uppercase letter, such as Button which refers to exontrol.Shapes.Button shape)
  

• "part", defines the name of the part the shape is applied on (as defined bellow)

The shapes property supports any of the following parts:

• "menu" (menu), defines the visual appearance for the entire menu
• "flat" (flat), defines the visual appearance for menu's flat bar (usually shown in the left side of the menu)
• "sep" (separator), defines the visual appearance to display separator-items
• "item" (item), defines the visual appearance for the item's background. It covers all parts of the item as check, image, caption/button, popup arrow and sub-items
• "sub" (sub-items), defines the visual appearance to display sub-items of the item (while the item is grouped)
• "arr" (arrow), defines the visual appearance to display item's arrow (while the item contains un-grouped sub-items)
• "cap" (caption), defines the visual appearance for the item's caption
• "img" (image), defines the visual appearance to display the item's image
• "chk" (check), defines the visual appearance to display the item's check-box
• "rad" (radio), defines the visual appearance to display the item's radio-button
• "btn" (button), defines the visual appearance to display the buttons
• "rarr" (right-arrow), defines the visual appearance to display button's arrow (to right)
• "barr" (bottom-arrow), defines the visual appearance to display button's arrow (to bottom)

.

null {null}, specifies the default visual appearance
 "" {string}, no shape (no visual appearance is applied to any part of the control)
 "red(item)", "#FF0000(item)", "rgb(255,0,0)(item)", "rgba(255,0,0,1)(item)" {string}, shows all-items in red
 '{"hover":{"frameColor":"black","pad":-0.5}}(item)' {string}, draws a black-frame arround the item being hovered
 "xxx(d),yyy(d,m),zzz(y)"  {string}, specifies that the exontrol.Shapes.Menu.xxx combined with exontrol.Shapes.Menu.yyy object defines the visual appearance of "d" part of the control, exontrol.Shapes.Menu.yyy object defines the visual appearance of "m" part of the control and exontrol.Shapes.Menu.zzz object defines the visual appearance of "y" part of the control

The show field defines how an item that has a check-box/radio button is displayed. Specifies a value of Menu.ShowCheckedAsSelectedEnum, that defines how an item that has a check-box/radio button is displayed. The Menu.ShowCheckedAsSelectedEnum type defines the following values:

• exDisplayItemCheckDefault (0), indicates that no highlight is applied to the item's check/radio
• exDisplayItemCheckHighlight (-1), highlights the checked item
• exDisplayItemHighlight (1), highlights the checked item, but hides the item's check/radio button

.

1 (Menu.ShowCheckedAsSelectedEnum.exDisplayItemHighlight) {number}, specifies that any checked-item gets highlighted, by not showing the item's check/radio button

The smoothSel field defines the time in ms the control's selection goes from one state to another.

0 {number}, no smooth changes once the user selects a new item
  125 {number}, specifies that a smooth-transition is performed from a layout to another for 125 ms.

The subArrangeItemsAs field specifies how the items are arranged on the float-menu. A ArrangeItemsEnum expression that specifies how the items are arranged arranged on the float-menu. The Menu.ArrangeItemsEnum type supports the following flags:

• exArrangeItemsHorizontal (1), specifies that the items are horizontally arranged from left to right
• exArrangeItemsVertical (2), specifies that the items are vertically arranged from top to bottom
• exArrangeItemsHideTopArrow (0x10), indicates that the arrow for any top-item is not visible (not valid for float-menu)
• exArrangeItemsPopupAlign (0x20), specifies that the item's float/popup-menu should be displayed to prevent overlapping other items
• exArrangeItemsWrap (0x100), wraps items on a new row/column (not valid for float-menu)
• exArrangeItemsScroll (0x200), specifies that the control's scroll bar is displayed if required
• exArrangeItemsAlignCenter (0x400), centers the items on each row/column
• exArrangeItemsAlignReverse (0x800), reverses the alignment of the items

.

257 or Menu.ArrangeItemsEnum.exArrangeItemsHorizontal | Menu.ArrangeItemsEnum.exArrangeItemsWrap {number}, wraps items within the float-menu
 546 or Menu.ArrangeItemsEnum.exArrangeItemsVertical | Menu.ArrangeItemsEnum.exArrangeItemsScroll | Menu.ArrangeItemsEnum.exArrangeItemsPopupAlign {number}, arranges vertically the items within the float-menu

The subClose field defines the time in ms the sub-menu is closed once the cursor hovers the second-level item (it is applied to any level excepts the top-level). The value of subClose property can be any of the following:

• if positive, indicates the time in ms the sub-menu is closed once the cursor hovers the second-level item
• if 0, indicates that the sub-menu is closed as soon as the cursor hovers a second-level item
• if negative, it has no effect

.

0 {number}, indicates that the sub-menu is closed as soon as the cursor hovers a second-level item
 350 {number}, the sub-menu is closed once 350 ms ellapsed after the cursor hovers the second-level item

The subOpen field defines the time in ms the second-level item opens its sub-menu once the cursor hovers it (it is applied to any level excepts the top-level). The value of subOpen property can be any of the following:

• if positive, indicates the time in ms the item opens its sub-menu once the cursor hovers it.
• if 0, indicates that the item opens its sub-menu as soon as the cursor hovers it
• if negative, it has no effect so the item requires click in order to open its sub-menu

.

0 {number}, indicates that the item opens its sub-menu as soon as the cursor hovers it
 -1 {number}, indicates that the item's sub-menu is opened once the user clicks it

The tfi field applies font attributes to captions within the control. The tfi field can be defined using a string representation such as "b monospace 16" or as an object such as {bold: true, fontName: "monospace", fontSize: 16}.

The tfi field as string supports any of the following keywords (each keyword can be specified using first letters only such as "b" for "bold) separated by space characters:

• bold, displays the text in bold (equivalent of <b> tag)
• italic, displays the text in italics (equivalent of <i> tag)
• underline, underlines the text (equivalent of <u> tag)
• strikeout, specifies whether the text is strike-through (equivalent of <s> tag)
• <fontName name>, specifies the font's family (equivalent of <font name> tag)
• <fontSize size>, specifies the size of the font (equivalent of <font ;size> tag)
• <fgColor CSSColor>, specifies the text's foreground color (equivalent of <fgcolor> tag)
• <bgColor CSSColor>, specifies the text's background color (equivalent of <bgcolor> tag)
• <shaColor CSSColor;width;offset>, defines the text's shadow (equivalent of <sha color;width;offset> tag)
• <outColor CSSColor>, shows the text with outlined characters (CSScolor) (equivalent of <out color> tag)
• <graColor CSSColor;mode;blend>, defines a gradient text (equivalent of <gra color;mode;blend> tag)

Any other word within the tfi field that's not recognized as a keyword is interpreted as:

• name of the font (not a number), specifies the font's family (equivalent of <font name> tag)
• size of the font (number), specifies the size of the font (equivalent of <font ;size> tag)

The tfi field as object supports any of the following fields:

• bold {boolean}, displays the text in bold (equivalent of <b> tag)
• italic {boolean}, displays the text in italics (equivalent of <i> tag)
• underline {boolean}, underlines the text (equivalent of <u> tag)
• strikeout {boolean}, specifies whether the text is strike-through (equivalent of <s> tag)
• fontName {string}, specifies the font's family (equivalent of <font name> tag)
• fontSize {number}, specifies the size of the font (equivalent of <font ;size> tag)
• fgColor {string}, specifies the text's foreground color (CSScolor) (equivalent of <fgcolor> tag)
• bgColor {string}, specifies the text's background color (CSScolor) (equivalent of <bgcolor> tag)
• shaColor {object}, specifies an object of {color, width, offset} type that defines the text's shadow (equivalent of <sha color;width;offset> tag), where:
  • color {string}, defines the color of the text's shadow (CSScolor)
  • width {number}, defines the size of the text's shadow
  • offset {number}, defines the offset to show the text's shadow relative to the text
• outColor {string}, shows the text with outlined characters (CSScolor) (equivalent of <out color> tag)
• graColor {object}, specifies an object of {color, mode, blend} type that defines a gradient text (equivalent of <gra color;mode;blend> tag), where:
  • color {string}, defines the gradient-color (CSScolor)
  • mode {number}, defines the gradient mode as a value between 0 and 4
  • blend {number}, defines the gradient blend as a value between 0 and 1

CSSColor or CSS legal color values can be specified by the following methods:

• Hexadecimal colors, is specified with: #RRGGBB, where the RR (red), GG (green) and BB (blue) hexadecimal integers specify the components of the color. All values must be between 00 and FF. For example, #0000ff value is rendered as blue, because the blue component is set to its highest value (ff) and the others are set to 00.
• Hexadecimal colors with transparency, is specified with: #RRGGBBAA, where AA (alpha) value must be between 00 and FF. For example, #0000ff80 defines a semi-transparent blue.
• RGB colors, is specified with the RGB(red, green, blue) function. Each parameter (red, green, and blue) defines the intensity of the color and can be an integer between 0 and 255. For example, rgb(0,0,255) defines the blue color.
• RGBA colors, are an extension of RGB color values with an alpha channel as RGBA(red, green, blue, alpha) function, where the alpha parameter is a number between 0.0 (fully transparent) and 1.0 (fully opaque). For example, rgba(0,0,255,0.5) defines a semi-transparent blue.
• HSL colors, is specified with the HSL(hue, saturation, lightness) function, where hue is a degree on the color wheel (from 0 to 360) - 0 (or 360) is red, 120 is green, 240 is blue. saturation is a percentage value; 0% means a shade of gray and 100% is the full color. lightness is also a percentage; 0% is black, 100% is white. HSL stands for hue, saturation, and lightness - and represents a cylindrical-coordinate representation of colors. For example, hsl(240, 100%, 50%) defines the blue color.
• HSLA colors, are an extension of HSL color values with an alpha channel - which specifies the opacity of the object as HSLA(hue, saturation, lightness, alpha) function, where alpha parameter is a number between 0.0 (fully transparent) and 1.0 (fully opaque). For example, hsla(240, 100%, 50%,0.5) defines a semi-transparent blue.
• Predefined/Cross-browser color names, 140 color names are predefined in the HTML and CSS color specification. For example, blue defines the blue color.

.

null {null}, the tfi field is ignored
  "bold monospace 16 <fg blue>" {string}, defines Monospace font of 16px height, bold and blue
  {bold: true, fontName: "monospace", fontSize: 16, fgColor: "blue"} {object}, defines Monospace font of 16px height, bold and blue

The wheelChange field specifies the amount the control scrolls when the user rolls the mouse wheel.

0 {number}, locks any action the mouse's wheel performs
  1 {number}, indicates that the scrollOpt.wheelChange property is applied for 1-time when user rotates the mouse wheel. Changes the scrollOpt.wheelChange property to provide a different step to scroll once the user rotates the mouse wheel

The x field defines the horizontal position to display the context/shortcut-menu relative to the document. The x property has effect only, if the control is opened as a context-menu, using the Open() method.

event.pageX {number}, The pageX read-only property of the MouseEvent(event) interface returns the X (horizontal) coordinate (in pixels) at which the mouse was clicked, relative to the left edge of the entire document.

The y field defines the vertical position to display the context/shortcut-menu relative to the document. The y property has effect only, if the control is opened as a context-menu, using the Open() method.

event.pageY {number}, The pageY read-only property of the MouseEvent(event) interface returns the Y (vertical) coordinate in pixels of the event relative to the whole document.