Do you wonder if your IT business is truly profitable or if you should raise your prices? Learn how to calculate your overhead burden using our free interactive tool and use it to determine the right price for your IT services. Start calculating Now!
If current page url
My code to add a class based on the current page is not working. Can you help me work out why?
See this url: http://new2.jensonfisher.com/about-us/values/
Look at the sub navigation below the image.
$(document).ready(function() {
$(function(){
var url = window.location.pathname,
urlRegExp = new RegExp(url.replace(/\/$/,'') + "$"); // create regexp to match current url pathname and remove trailing slash if present as it could collide with the link in navigation in case trailing slash wasn't present there
// now grab every link from the navigation
$('.sub_nav a').each(function(){
// and test its normalized href against the url pathname regexp
if(urlRegExp.test(this.href.replace(/\/$/,''))){
$(this).addClass('sub_nav_active');
}
});
});
});
See this url: http://new2.jensonfisher.com/about-us/values/
Look at the sub navigation below the image.
Do more with
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®
For one your code structure is a bit odd
This does not make sense - why are you using RegEx on a static string - when an '==' will do the same thing?
Here is a stab at doing what you want
$(document).ready(function() {
$(function(){
...
$(function() {
...
});
This does not make sense - why are you using RegEx on a static string - when an '==' will do the same thing?
urlRegExp = new RegExp(url.replace(/\/$/,'') + "$")
Here is a stab at doing what you want
$(function() {
// Get the pathname
var url = window.location.pathname;
// If the last char is a '/' then strip it
url = (url.substr(-1) === '/') ? url.slice(0, url.length-1) : url;
// Match the <a> with an href attr that matches the url
$('a[href="' + url +'"]').addClass('sub_nav_active');
});
The sample code below demonstrates the concept - working version here
HTML
HTML
<div class="sub_nav">
<ul>
<li><a href="/aboutus/values">Values</a></li>
<li><a href="/aboutus/diversity">Diversity</a></li>
</ul>
</div>
$(function() {
$('.tester').click(function(e) {
e.preventDefault();
url = $('#url').val();
url = (url.substr(-1) === '/') ? url.slice(0, url.length-1) : url;
$('.sub_nav_active').removeClass('sub_nav_active');
$('.sub_nav a[href="' + url +'"]').addClass('sub_nav_active');
});
});
Thanks, but it doesn't seem to work for me. What have I done wrong on this page...
http://new2.jensonfisher.com/about-us/values/
this is the script in the page: http://new2.jensonfisher.com/wp-content/themes/jensonfisher/js/jf-scripts.js
http://new2.jensonfisher.com/about-us/values/
this is the script in the page: http://new2.jensonfisher.com/wp-content/themes/jensonfisher/js/jf-scripts.js
Premium Content
You need an Expert Office subscription to comment.Start Free Trial