Pregunta

Sé que esto es muy fácil, pero he estado escribiendo y reescribiendo esta función durante una hora sin éxito:

Al hacer clic Quiero añadir "activa" a la <li> del enlace se ha hecho clic y quitar "activa" de los demás <li> de en la barra de navegación.

HTML:

   <nav>
     <ul>
       <li><a href="http://0327ea8.netsolhost.com/#home" class="home">Home</a></li>
       <li><a href="http://0327ea8.netsolhost.com/blog/" class="blog">Blog</a></li>
       <li><a href="http://0327ea8.netsolhost.com/#catalog" class="catalog">Catalog</a></li>
       <li><a href="http://0327ea8.netsolhost.com/#authors" class="authors">Authors</a></li>
       <li><a href="http://0327ea8.netsolhost.com/#store" class="store">Store</a></li>
     </ul>
   </nav>

jQuery:

  // NAVBAR ADD ACTIVE
   $("nav ul li a").click(function(){
     $("nav ul li").removeClass('active');
     $(this).stop().animate();
     $(this).parent().addClass('active');
   });

Esta es la adición de las clases muy bien, pero no puedo conseguir que se retire.

También he intentado separarla en a funciones separadas, pero sin suerte.

tengo la .Stop (). Animate () allí porque tengo un .animate () en el estado estacionario de los enlaces.

Gracias!

editar

este es el jQuery para el vuelo estacionario y la razón que tengo .Stop (). Animate ()

   $("nav ul li a, aside ul li.categories a, div.posts div.foot a").hover(function(){
     $(this).animate({'backgroundColor' : '#edf5e9'}, 200);
   },function() {
     $(this).animate({'backgroundColor' : '#ccd4c8'}, 600);
   });

No estoy seguro de por qué el .Stop (). Animate () es incorrecta. Si no tengo .animate () de la clase activa no se pegue, si lo hago, la clase de activo hace.

Todavía no puede conseguir la clase de quitar sin embargo: - /

¿Fue útil?

Solución

Prueba esto:

$(this).parent().siblings().removeClass('active');

Otros consejos

Trate algo aún más simple:

 $('li.active').removeClass('active');
Licenciado bajo: CC-BY-SA con atribución
No afiliado a StackOverflow
scroll top