🎨 Parallax

Turns any element's background into parallax with ease. It will add a wow factor to your website. Just read on to get started.

Prerequisits

• jQuery 3.1.2

Use

Add the source files

<script src="parallax.jquery.js"></script> <link href="parallax.min.css" />

Add the code

/*Create the object*/ var parallax = new Parallax($('#your-parallax'));  /*Bind the function to any event you chose*/ $(window).scroll(function(){     parallax.parallax() })

Add the element

<!--Keep at 100vh to remain visible--> <div class="parallax" style="height:100vh; background-image: 'bananna.jpeg' id="your-parallax"></div>

What it does

All the code actually does is slow down the speed of chosen objects background by 4 when scrolling. Therefore it scrolls slower than the foreground objects which scroll 4 times faster.