10 Best Parallax Scroll Effects In JavaScript (2020 Update)

Here is a constantly updated list of the 10 Best Free JavaScript libraries to create the familiar Parallax Scroll Effect on elements (e.g. images, backgrounds, videos, text, etc) as you scroll down or up the web page.

I hope you like it and don’t forget to spread the world.

Originally Published Dec 04 2018, updated Apr 28 2020

1. lax.js

awesome-scroll-effects-laxxx

Demo Download

laxxx is a lightweight vanilla JavaScript library that provides 20+ awesome animations for elements when scrolling down and up.


2. Lightweight Vanilla Javascript Parallax Library – rellax

rellax

Demo Download

rellax is a small vanilla JavaScript library which provides a smooth parallax scrolling effect on any DOM elements.


3. basicScroll

basicScroll

Demo Download

basicScroll is a lightweight, powerful, high-performance parallax scrolling JavaScript library designed for both mobile and desktop.


4. Rallax.js

parallax-scroll-rallax

Demo Download

Rallax.js is a brand new vanilla JavaScript parallax plugin that applies a dynamic, high-performance parallax scroll effect to elements within the document.


5. locomotive-scroll

Animate Elements On Scroll With Parallax Effect - locomotive-scroll

Demo Download

locomotive-scroll is a modern JS library that applies a smooth, subtle, configurable parallax scroll effect to elements when scrolled into view.


6. jarallax

jarallax

Demo Download

NO dependencies JavaScript parallax scrolling.


7. CSS @keyframes Like Sequence Animations On Scroll – Motus.js

CSS @keyframes Like Sequence Animations On Scroll - Motus.js-min

Demo Download

motus.js is a JavaScript animation library for scroll-triggered animations that allow you to control the intermediate steps in an animation sequence similar to the CSS @keyframes.


8. HTML5 / JavaScript Image Parallax Scrolling Effect – Parallax.js

HTML5 JavaScript Image Parallax Scrolling Effect Parallax.js

Demo Download

Parallax.js is a ECMAScript 6 compatible JavaScript library for implementing image parallax scrolling effects on your web page. All the configuration options can be passed via HTML5 data attributes on img tag.


9. Smooth Inertial & Parallax Scroll Effects In JavaScript – luxy.js

inertial-parallax-scroll-luxy-min

Demo Download

luxy.js is a lightweight JavaScript plugin which applies smooth inertial scroll and parallax scroll effects to your webpage.


10. Spotify Inspired Parallax Scrolling Effect In Vanilla JavaScript – Paraxify.js

Spotify Inspired Parallax Scrolling Effect In Vanilla JavaScript – Paraxify.js

Demo Download

Paraxify.js is a lightweight (3kb minified) JavaScript library for implementing the parallax scroll effect on your background images as you seen on Spotify.com. As you scroll down the page, the background images scroll slower than the foreground with a given animation speed and visible area.


Conclusion:

Looking for more JavaScript libraries for parallax scroll effects? Don’t forget to check out the Parallax section.

If you’re a jQuery user, here is a list of 10 best jQuery parallax scroll plugins created for you. Enjoy,

You Might Be Interested In: