Skip to content

Instantly share code, notes, and snippets.

@thebouv
Last active June 11, 2018 15:17
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save thebouv/8e6dbd6063c694139f07 to your computer and use it in GitHub Desktop.
Save thebouv/8e6dbd6063c694139f07 to your computer and use it in GitHub Desktop.
Highlight active menu item in bootstrap nav (that is just a link and not a pill or tab)
// highlight active menu item
var url = window.location;
$('ul.nav a').filter(function() {
return this.href == url;
}).parent().addClass('active');
// alternative for use with specific parameter checking
var url = window.location;
$('ul.nav a').filter(function() {
locationLink = getURLParameter('calID',url);
menuLink = getURLParameter('calID',this.href);
return (locationLink == menuLink);
}).parent().addClass('active');
function getURLParameter(name,url) {
return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(url)||[,""])[1].replace(/\+/g, '%20'))||null
}
@raoulduke
Copy link

This will also filter on pills and tabs. To target only the navbar you should be more specific with the identifier like:
$('nav ul.navbar-nav a')

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment