Smooth Scroll is a modern web design pattern that enables the visitor to smoothly scroll the web page to a particular position.
In this post, you will see the 10 best JavaScript libraries for the smooth scroll functionality without any 3rd dependencies (e.g. jQuery).
I hope you like it and help me spread the world.
Originally Published Dec 05 2017, updated Feb 10 2020
10 Best Smooth Scroll JavaScript Plugins:
1. Smooth Scroll With Easing Functions – smooth-scroll
A lightweight, fast JavaScript library which applies a smooth scroll behavior (with or without easing functions) to anchor links within the document.
2. Modern Performant Smooth Scroll Library – Jump.js
Jump.js is a modern, performant and customizable smooth scroll library written in pure JavaScript (ES6).
3. moveTo.js
moveTo.js is a lightweight JavaScript library that allows for scroll smoothly between content sections within the document. Powered by window.requestAnimationFrame() API and fully configurable via both JavaScript and Data attributes.
4. Native Smooth Scroll Polyfill – smoothscroll.js
smoothscroll.js is a lightweight, configurable, Vanilla JavaScript polyfill for native smooth scroll using CSS scroll-behavior: smooth property.
5. zenscroll
Zenscroll is a vanilla JavaScript library that enables animated vertical scrolling to an element or position within your document or within a scrollable element (DIV, etc.). It can also automatically smooth all scrolling within the same page.
6. Auto Apply Smooth Scroll Behavior To Anchor Links – anchor-scroll
An animated, highly customizable back to top button for scrolling the page to the top. Written in pure (vanilla) JavaScript.
7. Animated Customizable Back To Top Button In Vanilla JavaScript – vanilla-back-to-top
An animated, highly customizable back to top button for scrolling the page to the top. Written in pure (vanilla) JavaScript.
8. Horizonal & Vertical Smooth Scroll With Easing – easy-scroll
An easy and lightweight smooth scroll library that smoothly scrolls to top/right/bottom/left within your page or a specific container.
9. Scroll To Desired Page Offset Or A Specific Element – animated-scroll-to
animated-scroll-to is a vanilla JavaScript smooth scroll library that smoothly scrolls the page (or a scrollable element) to desired page offset or a specific element within the document.
10. ES6 Smooth Scroll Library – es6-scroll-to
Yet another smooth scroll library written in ES6 that smoothly scrolls the page to the top or a specific point with an easing effect.
More Resources:
To download more smooth scroll libraries for your modern website & web app, here are a few more resources available online:
