DEV Community

loading...
Cover image for How to scroll to the top of a webpage with smooth scroll animation using JavaScript?

How to scroll to the top of a webpage with smooth scroll animation using JavaScript?

MELVIN GEORGE
Hi, I'm Melvin George, A web developer, and a blogger.
Originally published at melvingeorge.me ・1 min read

Originally posted here!

To scroll to the top of the webpage with smooth scroll animation using JavaScript, you can use the scrollTo() method in the global window object and then pass an options object with the top property set to number value 0 and the behavior property set to string value smooth.

// Scroll to the top of the webpage
// using the window.scrollTo() method
window.scrollTo({
    top: 0;
    behavior: "smooth"
});
Enter fullscreen mode Exit fullscreen mode
  • the top property says to navigate to the top position in reference to the window.
  • and the behavior property set to smooth string makes the scrolling looks smooth.

See the above code live in JSBin

Feel free to share if you found this useful 😃.


Discussion (0)