Reputation: 324
I'm newbie and I'm trying to make smooth scroll in my one page scroll website. I found this code from here
$(function () {
$('a[href*=#]:not([href=#])').click(function () {
if (location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') && location.hostname == this.hostname) {
var target = $(this.hash);
target = target.length ? target : $('[name=' + this.hash.slice(1) + ']');
if (target.length) {
$('html,body').animate({
scrollTop: target.offset().top
}, 1000);
return false;
}
}
});
});
It works perfectly, problem is that I don't understand it ! Could someone explain it for me ?
P.S. - I don't know if this is a valid question for stackoverflow, if it's not just tell me and I delete this post.
Thanks
Upvotes: 0
Views: 87
Reputation: 10378
$(function() {
//^^^^ by this code start on dcocument load
$('a[href*=#]:not([href=#])').click(function() {
//^^^^ set selector (anchor tag)
if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
var target = $(this.hash);
target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
if (target.length) {
// ^^^^check target length is exist in target hash coming if this exist then go in if othervise not
$('html,body').animate({
//^^^^ here html and body animate
scrollTop: target.offset().top
//^^^^ get target scroll top position and move html,body scroll to this position
}, 1000);
return false;
}
}
});
});
Upvotes: 2