This sample demonstrates how you can replace the built-in MenuBar in WebMenu with your own custom MenuBar.
To accomplish this, you need to turn off the built-in MenuBar in WebMenu by setting the following property:
MenuBar.DisplayMode(DisplayModeConstants.None)
Next, you need to build your own MenuBar to anchor the WebMenu popup menus.
You can show and hide the popup menu by calling the client-side JavaScript methods
cswmShow and
cswmHide, respectively.
In this sample, this occurs during the
onmouseover and
onmouseout events on the buttons:
onmouseover="cswmShow('Home', 'HomeButton', 'below', 0, 0);"
onmouseout="cswmHide();"
This sample demonstrates the optional use of the WebMenu
OnShow and
OnHide events, which are invoked when the root popup menus are shown or hidden.
These event handers are configured to call the custom client-side JavaScript method
SwapButton which changes the image of the selected button:
WebMenu.OnShow("SwapButton(id, true)")
WebMenu.OnHide("SwapButton(id, false)")
This sample also uses the
WebMenu.SelectedBackgroundImage property to display an image when an item is highlighted.