Skip to main content
A newer version of this page is available. .
Tab

ASPxMenuBase.ItemSubMenuOffset Property

Gets specific offset settings for submenus of the submenu items.

Namespace: DevExpress.Web

Assembly: DevExpress.Web.v19.2.dll

Declaration

public ItemSubMenuOffset ItemSubMenuOffset { get; }

Property Value

Type Description
ItemSubMenuOffset

An ItemSubMenuOffset object that contains specific offset settings for submenu items’ submenus.

Remarks

Use the ItemSubMenuOffset property to access and customize specific offset settings which define how submenus are shifted horizontally and vertically relative to their parent menu items.

Example

This part of the Tabbed Menu demo illustrates how to customize the ASPxMenu control as a hierachical menu (with popped out submenus) which looks like a set of tabs.

Gradient borders for the menu’s root items (tabs) are drawn by using the RootItemTextTemplate property. The control’s style settings are defined via the ASPxMenuBase.ItemStyle property, ASPxMenuBase.SubMenuStyle property,etc.

...
<dxm:ASPxMenu EnableTheming="False" ID="ASPxMenu1" CssClass="TabbedMenu" 
runat="server" AppearAfter="0" DataSourceID="XmlDataSource1" ItemSpacing="0px" 
SeparatorHeight="28px" SeparatorWidth="1px" ShowSubMenuShadow="False" 
BorderBetweenItemAndSubMenu="HideRootOnly" Font-Names="Tahoma" Font-Size="8pt" 
Font-Underline="False" ForeColor="Black" AutoPostBack="True" SyncSelectionMode="None" 
ClientInstanceName="tabbedMenu" AllowSelectItem="True" SelectParentItem="True">
     <ItemStyle CssClass="rootItem" Wrap="False">
         <BackgroundImage ImageUrl="~/Menu/Images/TabbedMenu/RootItemSeparator.gif" 
         Repeat="NoRepeat" HorizontalPosition="right" />
         <Paddings Padding="0px" />
         <HoverStyle CssClass="rootItemHover">
         </HoverStyle>
         <SelectedStyle CssClass="rootItemSelected">
         </SelectedStyle>
     </ItemStyle>
     <Paddings Padding="0px" />
     <Border BorderStyle="None" />
     <RootItemSubMenuOffset X="-1" Y="-2" FirstItemX="-1" FirstItemY="-2" LastItemX="-1"
         LastItemY="-2" />
     <SubMenuStyle GutterWidth="0px" ItemSpacing="0px" BackColor="White" CssClass="menu">
         <Paddings Padding="1px" />
         <Border BorderColor="#919191" BorderStyle="Solid" BorderWidth="1px" />
     </SubMenuStyle>
     <SubMenuItemStyle Wrap="False">
         <HoverStyle BackColor="#EDEDED">
             <Border BorderWidth="0px" />
         </HoverStyle>
         <Paddings Padding="5px" PaddingLeft="7px" PaddingRight="7px" />
     </SubMenuItemStyle>
     <VerticalPopOutImage Height="5px" Url="~/Menu/Images/TabbedMenu/ItemArrow.gif" 
     Width="4px" />
     <ItemSubMenuOffset X="-1" Y="-2" FirstItemY="-3" LastItemY="-2" />
     <LinkStyle Color="Black">
         <Font Underline="False"></Font>
     </LinkStyle>
     <RootItemTextTemplate>
         <div><table cellpadding="0" cellspacing="0" border="0"><tr>
         <th class="WhiteBorderRight">
         <dxe:ASPxLabel ID="lblText" runat="server" EnableTheming="False" Text='<%# Eval("Text") %>' />
         </th></tr></table></div>
     </RootItemTextTemplate>
 </dxm:ASPxMenu>
...
See Also