Smooth Scrolling the document using CSS
My friend's team recently launched paychexcareers.in for hiring within India. So I was checking out the site's footer which has the famous scroll-to-top button / link.
This is famously done in jQuery using $('html, body').animate({ scrollTop: 0 })
This is the code on that page :
function() {
$('html, body').animate({
scrollTop: 0
}, 1500, 'easeInOutExpo');
return false;
}
But with modern browsers implementing latest CSS features this can be accomplished using CSS alone via scroll-behavior .
html
{
scroll-behavior: smooth;
}
This is available in most modern browsers (no IE) but Safari requires version 14.
About the author
- I am a web developer from Navi Mumbai. Mainly dealt with LAMP stack, now into Django and getting into Laravel and Cloud. Founder of nerul.in and gaali.in
Comments
Join the discussionNo comments yet. Be the first to comment.





