How to Add Active Class to navbar
2 posters
Page 1 of 1
How to Add Active Class to navbar
How do I add “active class” to the menu item with jQuery that links to the page on which the visitor or user is.
Last edited by Mati on September 21st 2015, 11:53 am; edited 1 time in total
Re: How to Add Active Class to navbar
It depends on the version of the forum you're asking for, but the typical way of checking is a clean URI against a clean href attribute.
Here's an example that should work on most default forum versions.
Then you can style the navigation link with CSS :
Here's an example that should work on most default forum versions.
- Code:
$(function() {
var cleanURI = window.location.href.replace(/\?.*|#.*/, ''), // get the clean URL without queries or hashes
menu = $('a.mainmenu'), // get menu items
i = 0, // set index
j = menu.length; // cache menu length
// loop menu links
for (; i < j; i++) {
// clean the href and compare it with the window location
if (menu[i].href.replace(/\?.*|#.*/, '') == cleanURI) {
menu[i].className += ' activeNav'; // add a new class
break; // break out of the loop because we found our match
}
}
});
Then you can style the navigation link with CSS :
- Code:
a.mainmenu.activeNav {
background:#39C;
}
Similar topics
» javascript active class code request
» Class or ID of Multiquotes?
» How do I use class in the code
» How to know the class address in the topic
» How to add a class to this javascript code?
» Class or ID of Multiquotes?
» How do I use class in the code
» How to know the class address in the topic
» How to add a class to this javascript code?
Page 1 of 1
Permissions in this forum:
You cannot reply to topics in this forum