Agregar clase de navegación activa basada en URL - Trucos CSS

Anonim

Lo ideal sería generar esta clase desde el lado del servidor, pero si no puede ...

Digamos que tiene una navegación como esta:


  • Home
  • About
  • Clients
  • Contact Us

Y estás en la URL:

http://yoursite.com/about/team/

Y desea que el enlace Acerca de obtenga una clase de "activo" para que pueda indicar visualmente que es la navegación activa.

$(function() ( $('nav a(href^="/' + location.pathname.split("/")(1) + '")').addClass('active'); ));

Básicamente, eso coincidirá con los enlaces en la navegación cuyo atributo href comience con "/ about" (o lo que sea que sea el directorio secundario).