Parallax Scroll For Image Plugin With Vanilla JS – simpleParallax.js

Demo    Download
Parallax Scroll For Image Plugins With Vanilla JS – simpleParallax
File Size: 96.5 KB
Views Total: 1225 views
Last Update:January 1, 1970
Publish Date: March 9, 2020
Official Website: Go to website
License: MIT
Plugin Author: geosigno

Simple parallax.js illustrates the image plugin in javascript with horizontal and vertical parallax effect. In this animation, the two images can simultaneously visualize in two different panes by just dragging the adjustable length option with the help of a mouse in a horizontal and vertical manner. The effect includes only images, no other content is used in this element. Fundamentally, the general behavior of this effect to analyze the myth of depth in a 2D display and adding to the insight of immersion in the pragmatic sense.

Table of Contents

How to use :

Add script :

<script src="simpleParallax.js"></script>

Giving the following HTML:

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

simply add the following JavaScript code:

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

You can also choose to apply the parallax on multiple images:

var images = document.querySelectorAll('img');
new simpleParallax(images);
orientationStringupup – right – down – left – up left – up right – down left – left right
scaleNumber1.2need to be above 1.0
delayNumber0.4the delay is in second
transitionString‘cubic-bezier(0,0,0,1)’any CSS transition
customContainerString or Nodefalse
maxTransitionNumber0it should be a percentage between 1 and 99


Mady Schaferhoff is an expert jQuery script at jQuerypost. He offers web development services to clients globally. He also loves sharing Html,CSS, jQuery knowledge through blog posts like this one.