Click an item to disable it. Click a top-level item to switch enable state of its subitems.
<%@ Page %>
<%@ Register TagPrefix="ec" Namespace="ASPNETExpert.WebControls" Assembly="ASPNETExpert.WebControls" %>
<%@ Register TagPrefix="ecd" TagName="Header" Src="../../Controls/Header.ascx"%>
<%@ Register TagPrefix="ecd" TagName="Footer" Src="../../Controls/Footer.ascx"%>
<%@ Register TagPrefix="ecd" Namespace="ASPNETExpert.WebControls.DemoControls" Assembly="ASPNETExpert.WebControls.DemoControls" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<title>ASP.NET Menu : ExpertMenu Demo : All Image Items</title>
<link href="../../style.css" type="text/css" rel="stylesheet">
<script language=javascript>
function ToggleItem(id){
var item = ec_GetMenu('<%=ExpertMenu1.UniqueID%>').FindById(id, true);
if(item)
item.SetEnabled(!item.Enabled());
}
</script>
</HEAD>
<body xmlns:ec="urn:http://aspnetexpert.com/ExpertControls.xsd">
<form id="Form1" method="post" runat="server">
<ecd:Header runat=server ID="Header1"></ecd:Header>
<div class="prompt" style="margin-top:0px;">Click an item to disable it. Click a top-level item to switch enable state of its subitems.</div>
<ec:ExpertMenu runat="server" id="ExpertMenu1" EnableViewState="false">
<Looks>
<ec:MenuGroupLook id="Group" Orientation="Vertical" ItemSpacing="1" Expand-Effect="Fade" Expand-Duration="300" Offset-Vertical="-1" Offset-Horizontal="-1" Shadow-Color="#9D7023" Shadow-Offset="3" Align-Vertical="Top"></ec:MenuGroupLook>
<ec:MenuItemImageLook Id="Item">
<InitLook Cursor="Pointer" />
<DisabledLook Cursor="Default" />
</ec:MenuItemImageLook>
</Looks>
<TopGroup>
<Items>
<ec:MenuItem ImageLook-Base="Item" ImageLook-InitLook-ImageUrl="images/File.gif" ImageLook-HoveredLook-ImageUrl="images/FileOver.gif" ImageLook-PushedLook-ImageUrl="images/FileDown.gif" ImageLook-ExpandedLook-ImageUrl="images/FileOver.gif" OnClientAfter-Click="ToggleItem('New');ToggleItem('Open');ToggleItem('Save');ToggleItem('SaveAs')" >
<SubMenu Look-Base="Group">
<Items>
<ec:MenuItem Id="New" ImageLook-Base="Item" ImageLook-InitLook-ImageUrl="images/New.gif" ImageLook-HoveredLook-ImageUrl="images/NewOver.gif" ImageLook-PushedLook-ImageUrl="images/NewDown.gif" ImageLook-DisabledLook-ImageUrl="images/NewDisabled.gif" OnClientAfter-Click="ToggleItem('New')" />
<ec:MenuItem Id="Open" ImageLook-Base="Item" ImageLook-InitLook-ImageUrl="images/Open.gif" ImageLook-HoveredLook-ImageUrl="images/OpenOver.gif" ImageLook-PushedLook-ImageUrl="images/OpenDown.gif" ImageLook-DisabledLook-ImageUrl="images/OpenDisabled.gif" OnClientAfter-Click="ToggleItem('Open')" />
<ec:MenuItem Id="Save" ImageLook-Base="Item" ImageLook-InitLook-ImageUrl="images/Save.gif" ImageLook-HoveredLook-ImageUrl="images/SaveOver.gif" ImageLook-PushedLook-ImageUrl="images/SaveDown.gif" ImageLook-DisabledLook-ImageUrl="images/SaveDisabled.gif" OnClientAfter-Click="ToggleItem('Save')" />
<ec:MenuItem Id="SaveAs" ImageLook-Base="Item" ImageLook-InitLook-ImageUrl="images/SaveAs.gif" ImageLook-HoveredLook-ImageUrl="images/SaveAsOver.gif" ImageLook-PushedLook-ImageUrl="images/SaveAsDown.gif" ImageLook-DisabledLook-ImageUrl="images/SaveAsDisabled.gif" OnClientAfter-Click="ToggleItem('SaveAs')" />
</Items>
</SubMenu>
</ec:MenuItem>
<ec:MenuItem ImageLook-Base="Item" ImageLook-InitLook-ImageUrl="images/Edit.gif" ImageLook-HoveredLook-ImageUrl="images/EditOver.gif" ImageLook-PushedLook-ImageUrl="images/EditDown.gif" ImageLook-ExpandedLook-ImageUrl="images/EditOver.gif" OnClientAfter-Click="ToggleItem('Cut');ToggleItem('Copy');ToggleItem('Paste')">
<SubMenu Look-Base="Group">
<Items>
<ec:MenuItem Id="Cut" ImageLook-Base="Item" ImageLook-InitLook-ImageUrl="images/Cut.gif" ImageLook-HoveredLook-ImageUrl="images/CutOver.gif" ImageLook-PushedLook-ImageUrl="images/CutDown.gif" ImageLook-DisabledLook-ImageUrl="images/CutDisabled.gif" OnClientAfter-Click="ToggleItem('Cut')" />
<ec:MenuItem Id="Copy" ImageLook-Base="Item" ImageLook-InitLook-ImageUrl="images/Copy.gif" ImageLook-HoveredLook-ImageUrl="images/CopyOver.gif" ImageLook-PushedLook-ImageUrl="images/CopyDown.gif" ImageLook-DisabledLook-ImageUrl="images/CopyDisabled.gif" OnClientAfter-Click="ToggleItem('Copy')" />
<ec:MenuItem Id="Paste" ImageLook-Base="Item" ImageLook-InitLook-ImageUrl="images/Paste.gif" ImageLook-HoveredLook-ImageUrl="images/PasteOver.gif" ImageLook-PushedLook-ImageUrl="images/PasteDown.gif" ImageLook-DisabledLook-ImageUrl="images/PasteDisabled.gif" OnClientAfter-Click="ToggleItem('Paste')" />
</Items>
</SubMenu>
</ec:MenuItem>
</Items>
</TopGroup>
</ec:ExpertMenu>
<br>
<ecd:DescriptionView runat="server" IconUrl="../../images/kv.gif">
<ecd:Description runat="server">
This demo creates a custom looking menu that consists of images only.
</ecd:Description>
<ecd:Description runat="server">
Every item defines a separate image for its <b>initial</b>, <b>hovered</b>, <b>pushed</b>
and <b>disabled</b> state.
</ecd:Description>
<ecd:Description runat="server">
Every item contains its own client-side handler code that processes clicks enabling and disabling items.
</ecd:Description>
</ecd:DescriptionView>
<ec:CodeViewTab id="CodeViewTab1" runat="server" ImagesBaseUrl="../../images/tab/">
<ec:TabItem runat="server" Text="aspx">
<pre class="aspcode">
<ecd:SyntaxHighlight runat="server" ContentType="ASPX" OutputFile="default.aspx" />
</pre>
</ec:TabItem>
</ec:CodeViewTab>
<ecd:Footer runat=server ID="Footer1"></ecd:Footer>
</form>
</body>
</HTML>