the easiest way to get a parallax effect with javascript

Go down to the website content

simpleParallax is a very simple and lightweight Vanilla JS library that improve your website with parallax animations on your images.

Where it may be laborious to get results through other plugins, simpleParallax stands out for its ease and its visual rendering. The parallax effect is directly applied on image tags, there is no need to use background images.

Any image will fit. Try it out!

simmleParallax illustration image


Install with Package Managers

npm install simple-parallax-js
yarn add simple-parallax-js

simpleParallax can be import this way

import simpleParallax from 'simple-parallax-js';

CDN links

<script src=""></script>


Giving the following HTML:

 <img class="thumbnail" src="image.jpg" alt="image">

Simply add the following JS code:

var image = document.getElementsByClassName('thumbnail');
new simpleParallax(image);


orientationstringupup - right - down - left - up left - up right - down left - left right
scaleint1.2need to be above 1.0 - no effect if overflow setting is set to true
overflowbooleanfalsetrue can be cool if you can manage it
delayint0the delay is in second
transitionstring'cubic-bezier(0,0,0,1)'transition can be any CSS transition
breakpointint768the breakpoint is in pixel


Destroy a simpleParallax instance:



You may want to talk about that