onestopjs

by Martin Koparanov

0%

Vintage scroll

use-closest-scroll


React hook to automatically scroll to the closest predefined element when the user stops scrolling.

Better demonstrated than explained: example

In short, it does not affect or restrict the user's scrolling, but when they stop scrolling, the view is snapped to one of the predefined elements.

Check it out on GitHub/npm.

Why it exists

Sometimes on your page, you have certain elements that you want to be in focus, you don't want to leave the user mid-sections looking at nothing.

However, taking over the user's scrolling is a bit of a controversial topic - nothing beats native scrolling. In fact, it's quite annoying when you just want to scroll, but some JavaScript is taking over to "smooth" it out.

That's why this package doesn't do any of that. It scrolls to predefined elements only when the user stops scrolling. As a result, the user has their native scrolling experience, but still stays focused on whatever you want. It's a trade-off.