Friday, December 19, 2008

Horizontal Menu and Sub Menu

To generate Horizontal Menu and sub menu

< style type="text/css">
#topNav
{
width: 100%;
background-color: #964240;
vertical-align: bottom;
padding: 0;
margin: 0;
z-index: 0;
}
#subNav
{
width: 100%;
border-left: solid 1px #000;
border-bottom: solid 1px #000;
border-right: solid 1px #000;
padding: 0;
margin: 0;
height: 24px;
background-color: #eee;
}
.staticMenuItemStyle
{
width: 89px;
background-color: #7A1312;
border: solid 1px #000;
color: #fff;
text-align: center;
}
.staticSelectedStyle
{
background-color: #eee;
color: #000;
border-bottom: solid 1px #eee;
z-index: 100;
}
.staticHoverStyle
{
background-color: #902423;
}

.substaticMenuItemStyle
{
width: 89px;
background-color: #eee;
text-align: center;
}
.substaticHoverStyle
{
background-color: #D0D0D0;
border: solid 1px #A68F8F;
}
< /style>


< !-- code for design of menus creation, place it in master page or simple page eg:- RolenMaster.master-- >


< div >
< asp:Menu ID="Menu1" OnPreRender="setRef" runat="server" DataSourceID="SiteMapDataSource1" MaximumDynamicDisplayLevels="0" Orientation="Horizontal" >
< StaticMenuItemStyle CssClass="staticMenuItemStyle" / >
< StaticSelectedStyle CssClass="staticSelectedStyle" / >
< StaticHoverStyle CssClass="staticHoverStyle" / >

< /asp:Menu >
< asp:SiteMapDataSource ID="SiteMapDataSource1" runat="server" ShowStartingNode="false" / >
< asp:Menu ID="Menu2" runat="server" DataSourceID="SiteMapDataSource2" MaximumDynamicDisplayLevels="0" Orientation = "Horizontal" >
< StaticMenuItemStyle CssClass="substaticMenuItemStyle" / >
< StaticHoverStyle CssClass="substaticHoverStyle" / >
< /asp:Menu >
< asp:SiteMapDataSource ID="SiteMapDataSource2" runat="server" ShowStartingNode="false" StartingNodeOffset="1" / >



< asp:ContentPlaceHolder OnPreRender="getRef" ID="ContentPlaceHolder2" runat="server" >
< /asp:ContentPlaceHolder >

< /div >


< !-- code in RolenMaster.Master.cs, code file of above page -->

protected void setRef(object sender, EventArgs e)
{
if (Menu1.SelectedItem != null) Session["lastTopMenuItemDataPath"] = Menu1.SelectedItem.DataPath;
}

protected void getRef(object sender, EventArgs e)
{
string ldp = Session["lastTopMenuItemDataPath"] == null ? "" : Session["lastTopMenuItemDataPath"].ToString();
if (ldp != null) foreach (MenuItem m in Menu1.Items) m.Selected = (m.DataPath == ldp && Menu2.Items.Count != 0);
}


< !-- site map -- >

< ?xml version="1.0" encoding="utf-8" ? >
< siteMap xmlns="http://schemas.microsoft.com/AspNet/SiteMap-File-1.0" >
< siteMapNode url="WebForm1.aspx" title="root" >
< siteMapNode url="WebForm1.aspx?ctrlID=1000" title="Admin" >
< siteMapNode url="WebForm1.aspx?ctrlID=1001" title="Create Project" > < /siteMapNode >
< siteMapNode url="WebForm1.aspx?ctrlID=1002" title="Create Workflow" > < /siteMapNode >
< siteMapNode url="WebForm1.aspx?ctrlID=1003" title="test" > < /siteMapNode >
< siteMapNode url="WebForm1.aspx?ctrlID=1004" title="not found" > < /siteMapNode >
< /siteMapNode >
< siteMapNode url="WebForm1.aspx?ctrlID=1100" title="Browse" >
< siteMapNode url="WebForm1.aspx?ctrlID=1101" title="Browse Projects" > < /siteMapNode >
< siteMapNode url="WebForm1.aspx?ctrlID=1102" title="Browse Workflows" > < /siteMapNode >
< siteMapNode url="WebForm1.aspx?ctrlID=1103" title="Welcome page" > < /siteMapNode >
< siteMapNode url="WebForm1.aspx?ctrlID=1104" title="Two.Four" > < /siteMapNode >
< /siteMapNode >
< /siteMapNode >

< /siteMap >

Share This!


No comments:

Powered By Blogger · Designed By Seo Blogger Templates