Minimal Horizontal/Vertical Parallax Scrolling Library – miniparallax.js

Category: Animation , Javascript , Recommended | October 21, 2022
Author:minimax711
Views Total:655 views
Official Page:Go to website
Last Update:October 21, 2022
License:MIT

Preview:

Minimal Horizontal/Vertical Parallax Scrolling Library – miniparallax.js

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 />

You Might Be Interested In:


Leave a Reply