导航栏中的当前菜单链接必须保持高亮显示 [英] Current menu link in nevigation bar must stay highlighted

问题描述

在导航栏上点击任何菜单（家庭），主页链接处于活动状态，但不保留高亮显示。

无法找到解决方案。 / p>

解决方案

您需要将活动类动态添加到菜单项，并向其添加合适的样式。
HTML

 < ul id =navi> 
< li>< a class =menuhref =＃>关于MHG< / a>< / li> 
< li>< a class =menuhref =＃>锻炼计划< / a>< / li> 
< li>< a class =menuhref =＃>健身提示< / a>< / li> 
< li>< a class =menuhref =＃>与我们联系< / a>< / li> 
< li>< a class =menuhref =＃>阅读我们的博客< / a>< / li& 
< / ul> 
  

jquery

  $（'a.menu'）。click（function（）{
 $（'a.menu'）。removeClass（active）; 
 $（this）.addClass（active）; 
}）; 
  

JSFIDDLE

参考 - Jquery将活动类添加到主菜单

On navigation bar once i clicked on any menu like (Home), home link is active but doesn't stay highlighted.

Unable to find the solution.

解决方案

You need to dynamically add active class to menu item and add suitable style to it. HTML

<ul id="navi">
    <li><a class="menu" href="#">About MHG</a></li>
    <li><a class="menu" href="#">Workout Programs</a></li>
    <li><a class="menu" href="#">Fitness Tips</a></li>
    <li><a class="menu" href="#">Contact Us</a></li>          
    <li><a class="menu" href="#">Read Our Blog</a></li>
  </ul>

jquery

$('a.menu').click(function(){
    $('a.menu').removeClass("active");
    $(this).addClass("active");
});

JSFIDDLE

Reference - Jquery Add active class to main menu

这篇关于导航栏中的当前菜单链接必须保持高亮显示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！