Sometimes jQuery effects don't work...
I'll try to explain this the best way I can... Sometimes the effects that I have created don't quite work. For example:
I have a "smooth scroll"-type effect when someone clicks on a link at the top of the page. When you click "icons" in the navigation menu, the page slides down to a div with the id of "iconsSection". However, every once in awhile, I'll click the icons link, and it will only slide down to the "wallpaperSection" div. This happens all of the time, and it's frustrating as hell. I am in no way a "coder," so there's a good chance that my script isn't written perfectly. However, I'm just not sure. I lifted the following code from a website that I can't quite remember, but here it is:
function filterPath(string) {
return string
.replace(/^\//,'')
.replace(/(index|default).[a-zA-Z]{3,4}$/,'')
.replace(/\/$/,'');
}
var locationPath = filterPath(location.pathname);
$('a[href*=#]').each(function() {
var thisPath = filterPath(this.pathname) || locationPath;
if ( locationPath == thisPath
&& (location.hostname == this.hostname || !this.hostname)
&& this.hash.replace(/#/,'') ) {
var $target = $(this.hash), target = this.hash;
if (target) {
var targetOffset = $target.offset().top;
$(this).click(function(event) {
event.preventDefault();
$('html, body').animate({scrollTop: targetOffset}, 800, "easeInOutQuad", function() {
location.hash = target;
});
});
}
}
});
Is there a "better" way to write that function or what? I'm totally clueless. Like I said before, my jQuery skills consist of being able to create simple hover effects and whatnot. Any help would be greatly appreciated. Thanks a lot!