Posts Learn Components Snippets Categories Tags Tools About

Scroll to Top One-Liner Snippet

Learn how to define Scroll Scroll to Top One-Liner to ease the way to write your code.

Created on Jun 28, 2022


There is a method called scrollTo(x-coordinate, y-coordinate), which allows you to scroll to a particular set of used coordinates. By making use of this one-liner code you will be able to scroll anywhere that you have bind on your web page.
const x = 100; // or any values
const y = 50; // or any values

const scrollToTop = () => window.scrollTo(x, y);

In addition to that, you can also set to have a smooth scrolling animation by adding the "smooth" behavior option.
const scrollToTop = () => window.scrollTo({ top: 100, behavior: 'smooth' });

If you like our tutorial, do make sure to support us by being our Patreon or buy us some coffee ☕️

Load comments for Scroll to Top One-Liner Snippet


PostSrc Code Components

Collection of Tailwind CSS components for everyone to use. Browse all of the components that are right for your project.

View Components

Sponsors 👑

+ Add Yours