jquery - Change list element class on smoothscroll -


i trying change class of list < li> element class="active" when scroll it.

function onscroll(event){ var scrollpos = $(document).scrolltop(); $('#menu').each(function () {     var currlink = $(this);     var refelement = $(currlink.attr("href"));     if (refelement.position().top <= scrollpos && refelement.position().top + refelement.height() > scrollpos) {         $('#menu ul li').removeclass("active"); //added remove active class elements         currlink.addclass("active");     }     else{         currlink.removeclass("active");     } }); 

here menu

<div class="navbar navbar-inverse" data-spy="affix" id="header" role="navigation" data-offset-top="100">   <div class="container">     <div class="navbar-header">       <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">         <span class="sr-only">toggle navigation</span>         <span class="icon-bar"></span>         <span class="icon-bar"></span>         <span class="icon-bar"></span>       </button>       <a class="navbar-brand" href="#">project name</a>     </div>     <div class="navbar-collapse collapse" id="menu">       <ul class="nav navbar-nav navbar-right">           <li class="active"><a href="#home">home</a></li>           <li><a href="#about">about</a></li>           <li><a href="#">testimonials</a></li>           <li class="dropdown">             <a href="#" class="dropdown-toggle" data-toggle="dropdown">dropdown <b class="caret"></b></a>             <ul class="dropdown-menu">               <li class="dropdown-header">description header</li>               <li><a href="#">action</a></li>               <li><a href="#">another action</a></li>               <li><a href="#">something else here</a></li>               <li class="divider"></li>               <li><a href="#">more links</a></li>               <li><a href="#">and 1 grow on</a></li>             </ul>           </li>           <li><a href="#">contact</a></li>         </ul>     </div><!--/.navbar-collapse -->   </div> </div>   

i not sure if i'm modifying list element correctly or not. smooth scrolling works fine, class won't change.

thanks!

try like,

$("li").click(function(){  $(".active").removeclass(".actvie");  $(this).addclass("active"); }); 

Comments

Popular posts from this blog

php - SPIP: From Tag directly to an article -

jquery - isAjaxRequest always return false -

ruby on rails - In a controller spec, how to find a specific tag in the generated view? -