This demo illustrates the DevExpress MVC Menu’s ability to display scroll buttons for submenus whose content does not fit within the visible area. To describe the capabilities of the MVC Menu effectively, it is displayed within an IFRAME element thus simulating window boundaries.
By default, submenus are automatically rendered to accommodate their entire content. If a submenu contains a large number of items, it might not fit vertically in the visible area. This occurs when a submenu's height exceeds the browser window's height (or the height of an IFRAME containing the menu). In such instances, scroll buttons are needed within the submenus. If scroll buttons are enabled, a submenu that does not fit the visible area automatically adjusts its height to fit the area and displays scroll buttons, allowing submenu items to be scrolled vertically. To scroll, hover the mouse pointer over a scroll button or click it to scroll faster.
To enable scroll buttons for all submenus in a menu, set the menu's EnableSubMenuScrolling property to true. To enable scroll buttons for specific submenus, use the EnableScrolling property of a submenu's parent menu item. You can customize the appearance of scroll buttons by providing custom images via the ScrollButtonStyle, ScrollDownButtonImage, and ScrollUpButtonImage properties.
Local Copy of this Demo
To inspect the source code for this demo on your machine, you must first install our components via the DevExpress Component Installer.
You can open a local copy of this online demo directly from this webpage (if using v20.2.8, 21.1.4 or higher).
The source code files for this demo are installed (by default) in the following directory:
Open CS Solution
\Users\Public\Documents\DevExpress Demos XX.X\Components\ASP.NET\CS\MVCxNavigationAndLayoutDemos