javascript - How to scroll to top before going to a different page, when a user clicks a link? -
i'm trying create smooth page transitions on website, user doesn't feel "page load" when he/she clicks link different page. 2 examples of want minimalissimo.com , defringe.com. when click link different article on page of these sites, page animates scroll top before next page starts loading.
so far have following code:
jquery(document).ready(function($){ $back_to_top = $('.link-to-article'); $back_to_top.on('click', function(){ $("html, body").animate({scrolltop:0},260); }); });
the above code doesn't work, no scroll occurs when click link class; however, if use prevent default page scroll top of course next page doesn't open link disabled preventdefault.
please let me know if can help. thank you.
you correct need use preventdefault
, need manually redirect once animation complete:
$back_to_top.on('click', function(){ var href = $(this).attr('href'); $(document.body).animate({scrolltop:0}, 260, function() { window.location.href = href; }); return false; });