Reputation: 1329
I've browsed a few other questions on here with getting current page url with jQuery and/or plain javascript but I have been having no luck.
My goal is this: depending on what page the user is on, I want a border under that menu item. This is how I am attempting to do it:
var urlHome = 'http://example.com/'
var urlShop = 'http://example.com/shop/'
var urlTeam = 'http://example.com/team/'
if (document.url.is(urlHome)) {
$('#home-link').css('border-bottom', '1px solid #000');
}
else if (document.url.is(urlShop)) {
$('#shop-link').css('border-bottom', '1px solid #000');
}
else if (document.url.is(urlTeam)) {
$('#team-link').css('border-bottom', '1px solid #000');
};
Unfortunately this code isn't working for me, I'm open to any and all suggestions, thank you in advance for your help.
Upvotes: 3
Views: 96
Reputation: 561
var loc = window.location.href,id="";
if (loc === urlHome) id = "home";
else if (loc === urlShop) id = "shop";
else if (loc === urlTeam) id = "team";
if (id) $('#'+id+'-link').css('border-bottom', '1px solid #000');
This works for me, with my own variables of course :)
Upvotes: 3