Opening and Closing
By default, the Menu opens and closes the items which contain children on mouseenter and mouseleave with a small delay.
To customize its opening and closing behavior, utilize the following options:
Delay on Hover
To prevent the accidental opening or closing of the Menu items, the component waits for 100 milliseconds before performing the action. To change the default delay on hover, use the hoverDelay property.
Opening on Click
By default, the Menu items open on hover. To specify that the items have to open on click instead of on hover, use the openOnClick property.
After the user opens an item with a click, all Menu items open on hover until one of them is selected. To configure this behavior, use the openOnClick.toggle option.
Besides the default "select" value, you can also specify:
"leave"—The items open on hover until either an item is selected, or the mouse pointer leaves the Menu and the predefined delay passes."click"—The items open on hover but do not close when the mouse pointer leaves the Menu. To close the items and avoid opening the Menu on hover, the user has to click a random place on the page.
The following example demonstrates the behavior of the Menu when toggle is set to "leave".
The following example demonstrates the behavior of the Menu when toggle is set to "click".