Menu control can be used to navigate through pages that is used to create a menu of hierarchical data. In the menu control, there are two types of conceptually designed items that are the first StaticMenu which is always displayed on the page Is the second dynamic menu that appears when the original item opens.
Properties like back collar, foreclosure, border coral, border style, borderwidth, height etc are applied through the style of table, tr, td /> tag.
Following are some important properties that are very useful.'
Properties of Menu Control | |
---|---|
DataSourceID | Point to the data source to use (you can use the .sitemap file as the data source). |
Text | Indicates the text to display in the menu. |
Tooltip | Indicates the tooltip of the menu item when you mouse over. |
Value | Indicates the nondisplayed value (usually unique id to use in server side events) |
NavigateUrl | The menu indicates the target location to send the user to when the item is clicked, if not set, then you can control the menu itamclick event. |
Target | If NavigationTool property is set, this indicates how to open the target location (in a new window or in the same window) |
Selectable | true/false. If false, this item can't be selected. Usually in case of this item has some child. |
ImageUrl | Indicates the image that appears next to the menu item. |
ImageToolTip | Indicates the tooltip text to display for image next to the item. |
PopOutImageUrl | Inidcates the image that is displayed right to the menu item when it has some subitems. |
Target | If NavigationUrl property is set, it indicates where to open the target location (in new window or same window). |
Styles of Menu Control | |
StaticMenuStyle | Sets the style of the parent box in which all menu items appears. |
DynamicMenuStyle | Sets the style of the parent box in which dynamic menu items appears. |
StaticMenuItemStyle | Sets the style of the individual static menu items. |
DynamicMenuItemStyle | Sets the style of the individual dynamic menu items. |
StaticSelectedStyle | Sets the style of the selected static items. |
DynamicSelectedStyle | Sets the style of the selecdted dynamic items. |
StaticHoverStyle | Sets the mouse hovering style of the static items. |
DynamicHoverStyle | Sets the mouse hovering style of the dynamic items (subitems). |
| |
Example -
// Menu Control ////////////////////////////
<asp:Menu ID="Menu1" runat="Server" DataSourceID="SiteMapDataSource1"
Orientation="Horizontal" BackColor="#B5C7DE" DynamicHorizontalOffset="2" Font-Names="Verdana" Font-Size="0.8em" ForeColor="#284E98" StaticDisplayLevels="2" StaticSubMenuIndent="10px"
>
<StaticMenuItemStyle HorizontalPadding="5px" VerticalPadding="2px" />
<DynamicHoverStyle BackColor="#284E98" ForeColor="White" />
<DynamicMenuStyle BackColor="#B5C7DE" />
<StaticSelectedStyle BackColor="#507CD1" />
<DynamicSelectedStyle BackColor="#507CD1" />
<DynamicMenuItemStyle HorizontalPadding="5px" VerticalPadding="2px" />
<StaticHoverStyle BackColor="#284E98" ForeColor="White" />
</asp:Menu>
// SiteMapDataSource Control ////////////////////////////
<asp:SiteMapDataSource ID="SiteMapDataSource1" runat="Server" />
0 comments:
Post a Comment