ComponentOne Menu for ASP.NET AJAX: Menu Item Types > Link Items

Link Items

Link items are menu items that contain links to help users move to other pages, within a document or within a site, or to other pages on the web. When the link item is activated by a user action, it can navigate to another Web page indicated by the NavigateUrl property or it can open a new window if the Target property is specified. Elements such as Text, graphic/multimedia buttons or image maps can be associated with the link items.

Use the NavigateUrl property to link menu item to a URL. You can assign the URL to the NavigateUrl property in one of the following ways:

      If the URL is within the same ASP.NET application use the "~" before the URL like the following:

NavigateUrl = "~/Default2.aspx"

      If the URL is an external URL, then use the protocol, for example:

NavigateUrl = "http://www.componentone.com"

The Target property takes precedence over the NavigateUrl property so if both properties are specified, the content of the specified URL page with be displayed in the specified window or frame when the user clicks on the item. If the user only specifies the URL for the NavigateUrl property then when the user clicks on the item the current page will transfer to the specified URL page.

Link items can be combined with heading items, group items, and separator items to create a well designed navigational menu system. A link item can have submenu items. A link item type can have four states for the link items: active, disabled, focus, and hover. Each state is defined by applying the appropriate CSS styles and specifying whether or not the link item is enabled.

Link Item States and Styles

 

Link Item State

CSS Selector

Description

Active

.C1Menu_VisualStyleName a:active

The link item is in active state when it’s enabled and the mouse pointer or other device isn’t resting on it.

Disabled

.C1Menu_VisualStyleName .disabled-item span.C1TextNode

The link item is in disabled state when enabled is set to false.

Focus

.C1Menu_VisualStyle a:focus,

The link item is in focus state when the mouse pointer is hovering over the C1Menu.

Hover

.C1Menu_VisualStyleName a:hover,

The link item is in focus state when the mouse pointer is hovering over the C1MenuItem.

 

Link SubItem States and Styles

 

Link Item State

CSS Selector

Description

Active

.C1Menu_VisualStyleName .C1SubMenu .c1-h-flow a:hover,

The link item is in active state when it’s enabled and the mouse pointer or other device isn’t resting on it.

Disabled

.C1Menu_VisualStyleName .C1SubMenu .c1-h-flow .disabled-item span.C1TextNode

The link item is in disabled state when enabled is set to false.

Focus

.C1Menu_VisualStyle .C1SubMenu .c1-h-flow a:focus

The link item is in focus state when the mouse pointer is hovering over the C1Menu.

Hover

.C1Menu_VisualStyleName .C1SubMenu .c1-h-flow a:hover,

The link item is in hovering state when the mouse pointer is hovering over the C1MenuItem.


Send comments about this topic to ComponentOne.
Copyright © 1987-2010 ComponentOne LLC. All rights reserved.