Asp.menu - 活跃时保持悬停效果

时间:2014-10-23 12:01:06

标签: asp.net menu hover master-pages

我有一个asp.net菜单控件所在的母版页。

我想要的是,如果我单击菜单中的链接,我希望我刚刚点击的菜单项保持悬停效果,只要它处于活动状态。

使用asp.net菜单有可能吗? :)

我尝试过在网上找到的代码:

<div class="topnav">
    <asp:menu id="topnav" runat="server" orientation="Horizontal" renderingmode="List" skiplinktext="" maximumdynamicdisplaylevels="1" viewstatemode="Enabled" >
        <items>
            <asp:menuitem navigateurl="~/Default.aspx" text="Home" value="home"></asp:menuitem>
            <asp:menuitem navigateurl="~/Overview.aspx" text="Overview" value="overview"></asp:menuitem>
            <asp:menuitem navigateurl="~/Benefits.aspx" text="Benefits" value="benefits"></asp:menuitem>
            <asp:menuitem navigateurl="~/Home.aspx" text="Hardware" value="hardware"></asp:menuitem>
            <asp:menuitem navigateurl="~/SDK.aspx" text="Develop" value="SDK"></asp:menuitem>
        </items>
    </asp:menu>
</div>

.topnav
{
    background-color: #ddd;
    /*margin-top: 1px;*/
    line-height: 22px;
    float: right;
    margin-right: 11px;
    background: url(../img/shadow.gif) repeat-y top right;


    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: bold;
    color: #777;
    text-align: center;
}

.topnav #topnav li
{
    float: left;
}

.right .topnavcont
{
    width: 767px;
    background-color: #dddddd !important;
    height: 22px;
}

.topnav li
{
    width: 109px;
}

.topnav a:link, .topnav a:visited
{
    color: #777;
    display: block;
    background-image: url(../img/bg_n-s.gif);
    background-repeat: repeat-x;
    text-decoration: none;
    visibility: visible;
}

.topnav  a:hover 
{
    color: #fff !important;
    background-image: url(../img/bg_h-s.gif);
    display: block;
    visibility: visible;
}

topnav .staticmenuitemselected
{
    color: red;
    display: block;
    background-image: url(../img/bg_n-s.gif);
    background-repeat: repeat-x;
    text-decoration: none;
    visibility: visible;
}

1 个答案:

答案 0 :(得分:0)

遍历menuItem并检查当前页面URL是否包含NavigateUrl

      foreach (MenuItem item in mn.Items)
      {
     if   (Request.Url.AbsoluteUri.ToLower().Contains(Page.ResolveUrl(item.NavigateUrl.ToLower()))
     {
       item.Selected = true;
      }
        }

    REFER THIS [http://stackoverflow.com/questions/8053337/asp-net-4-highlight-menu-item-for-current-page]

_______或___________

菜单中有一个StaticSelectedStyle属性。

      <asp:menu id="menu" runat="server" >
      <staticselectedstyle backcolor=""
      borderstyle=""
      bordercolor=""
      borderwidth=""/>
      </menu> 
      FIND MORE [http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.menu.includestyleblock.aspx] and [http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.menu.staticselectedstyle.aspx]