css中的活動標籤

我有冗長的引導主題類結構。css中的活動標籤

這是我正在設計的菜單。

Dashboard select with current '.active' class-

有在bootstrap-

<div class="navbar navbar-fixed-top navbar-inverse"> 
      <div class="navbar-inner"> 
       <div class="container-fluid"> 
        <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"><span 
         class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar"></span> 
        </a><a class="brand" href="#">My Menu</a> 
        <div class="nav-collapse"> 
         <ul class="nav"> 
          <li class="active"><a href="/Home/Dashboard"><i class="icon-home icon-white"></i>Dashboard</a></li> 
          <li ><a href="#" id="taskMainLink">Task</a></li> 

          <li><a href="#" id="contactMainLink">Contact</a></li> 

          <li><a href="#" id="appointmentMainLink">Appointment</a></li> 

          <li><a href="#" id="projectMainLink">Project</a></li> 

          <li><a href="#" id="salesMainLink">Sales</a></li> 

         </ul>

這個代碼此菜單欄設計現在發出

我希望每個選項卡上點擊鼠標和其他籤應該是積極的在原始狀態。默認情況下，當前活動類是儀表板。

結構我下面我每次點擊任何製表

$('.navbar.navbar-fixed-top.navbar-inverse>.container-fluid>.nav-collapse>.nav').click(function(){ 
$(this).find('li').removeClass('active'); 
$(this).addClass('active'); 
});

爲我要去正確的類爲類？如果我在這裏錯了，請建議我正確的解決方案。

來源

2013-02-09 Manoj

試試這個：

$('ul.nav li a').click(function(){ 
    $(this).parent().parent().children('.active').removeClass('active'); 
    $(this.parentNode).addClass('active'); 
    return false; 
});

來源

2013-02-09 12:43:38

可以請你給出parentNode意見，如何找到父元素？ – Manoj 2013-02-10 03:44:32

'this.parentNode'是選擇器，它選擇父節點。 – 2013-02-10 05:09:25

這應該做的伎倆：

$('ul.nav li a').click(function(e){ 
    e.preventDefault(); 
    $(this).parent().find('li.active').removeClass('active'); 
    $(this).addClass('active'); 
});

來源

2013-02-09 12:42:21 soyuka

我認爲這可能是您更輕鬆地使用引導buttonDropdown成分，這是否適合你。

嘗試使用這些按鈕，下拉菜單與buttonGroups組件，讓您的按鍵組合在一起並應用CSS來使它看起來像你的那一刻菜單。

你不需要任何額外的JavaScript來使你的菜單工作！

來源

2013-02-09 12:43:17 Undefined

css中的活動標籤

回答

相關問題