Actieve navigatieklasse toevoegen op basis van URL - CSS-trucs

Anonim

Idealiter voer je deze klasse uit vanaf de server, maar als je dat niet kunt ...

Stel dat u een navigatie als volgt heeft:



    

  • Home
    • 

  • About
    • 

  • Clients
    • 

  • Contact Us
    •

En je bent op de URL:

http://uwsite.com/about/team/

En u wilt dat de Over-link een klasse "actief" krijgt, zodat u visueel kunt aangeven dat het de actieve navigatie is.

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

In wezen komt dat overeen met links in de nav wiens href-attribuut begint met "/ about" (of wat de secundaire directory ook is).