Minimal Horizontal/Vertical Parallax Scrolling Library – miniparallax.js

Preview:

Description:

miniparallax.js is a super tiny (~1kb minified), blazing-fast, and customizable parallax library that supports both horizontal and vertical parallax scrolling effects.

How to use it:

1. To get started, include the parallax.min.css and parallax.min.js on the page.

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

2. Add the CSS class parallax to the parallax element, and the library will do the rest.

<div class="parallax-container">
  <img class="parallax" src="parallax.jpg" />
</div>

.parallax-container {
  position: relative;
  /* more styles here */
}

3. It also supports parallax elements with no wrappers.

<img class="parallax" src="parallax.jpg" noscale />

4. Horizontal parallax scrolling is supported as well.

<img class="parallax" src="parallax.jpg" x noscale />