突出显示菜单中选择选项卡 [英] Highlight selected tab in menu

问题描述

我有以下选项卡式浏览设置在我的母版页：

I have the following tabbed navigation setup in my master page:

<div id="header">
            <div id="logo">
                <a href="../default.aspx">Logo</a>
            </div>
            <div id="menu">
                <div class="buttons">
                <ul>
                    <li><a href="../default.aspx">Home</a></li>
                    <li><a href="../books/books.aspx">Books</a></li>
                    <li><a href="../contacts/aboutus.aspx">About Us</a></li>
                    <li><a href="../contacts/contact.aspx">Contact Us</a></li>
                </ul>
                </div>
            </div>
</div>

例如，当我点击主页选项卡，我想它仍然突出（例如背景颜色：＃1087a4; ）。什么是完成这一任务的推荐的方法？而且，这都在母版页中实现？

For example when I click Home tab, I'd like it to remain highlighted (ex. background-color: #1087a4;). What is the recommended way to accomplish this? And does this have to be implemented in the Master Page?

推荐答案

给 ID ， =服务器到每一个环节。并找到从内容页该链接并给予风格那边。

GiveID, runat="server" to each link. And find that link from the Content Page and give the style over there.

例如：

<div id="header">
   <div id="logo">
      <a href="../default.aspx">Logo</a>
    </div>
    <div id="menu">
      <div class="buttons">
         <ul>
           <li><a id="lbtnHome" runat="server" href="../default.aspx">Home</a></li>
           <li><a id="lbtnBooks" runat="server" href="../books/books.aspx">Books</a></li>
           <li><a id="lbtnAbout" runat="server" href="../contacts/aboutus.aspx">About Us</a></li>
           <li><a id="lbtnContact" runat="server" href="../contacts/contact.aspx">Contact Us</a></li>
         </ul>
      </div>
   </div>
</div>

首页

<script type="text/javascript">
   var link = document.getElementById('<%=Master.FindControl("lbtnHome").ClientID %>');
   link.style.color = '#1087a4';
</script>

图书页

<script type="text/javascript">
   var link = document.getElementById('<%=Master.FindControl("lbtnBooks").ClientID %>');
   link.style.color = '#1087a4';
</script>

就像同样为所有其他网页。

Like the same for all other pages.

这篇关于突出显示菜单中选择选项卡的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！