Applying flyout mode to navigation fields
Previously, vertical navigation fields could be displayed only by expanding the menu items in them vertically or horizontally. As a result, navigation fields containing many menu items could require a significant amount of screen space to display all of the items included in a menu.
Configure vertical field menu items to display them in a flyout mode. When users select menu items, those items are displayed to the right of the menu from which they were selected. Submenus also can be set to fly out from their main menu items.
Enabling menu items to be displayed in this mode, as shown in the following figure, can help you make better use of screen space and can enhance the web look and feel for a form.
If you create two or more adjacent navigation fields with flyout enabled, be sure that you allow enough space between the two navigation fields so that any submenu items that they contain do not overlap. If they overlap, one submenu will be hidden beneath the submenu of the adjacent navigation field and will not be visible to the user. For example, if you create two adjacent navigation fields and one is at the right edge of the form without enough space for its menu items to fly out to the right, those menu items will fly out to the left instead, and will be hidden by the items on the navigation field next to it.
Flyout navigation menu display
(Click the image to expand it.)
Use the Mode property in Developer Studio to enable flyout capability for menus displayed in vertical navigation fields on the web. This property has two settings:
- Expandable — Menu items are displayed vertically as expandable lists. (See Expanding and collapsing items in the navigation bar.)
- Flyout — Menu items are displayed in a parallel list to the right of the menu.
A flyout menu can be displayed either when a menu is clicked or when the user moves the mouse over it.
When a navigation bar resides within a panel, you might not see all of the navigation bar's available menus. For example, if a navigation bar has 10 menus, you might initially see only 7 of them (depending on the size of the panel). To see the remaining menus, you must click or hover over the last visible root (first-level) menu (for example, the 7th menu).