Author: | JavaScriptUtilities |
---|---|
Views Total: | 671 views |
Official Page: | Go to website |
Last Update: | June 24, 2018 |
License: | MIT |
Preview:

Description:
vanillaInfiniteScroll is a lightweight, pure Vanilla JavaScript library that makes it easier to apply the familiar Parallax Scrolling effect to any DOM elements using HTML5 data
attributes.
How to use it:
Load the main JS file vanilla-jsuparallax.js at the end of the html document so the page loads faster.
<script src="js/vanilla-jsuparallax.js"></script>
Create a new vanillaJsuParallax instance and specify the target elements to be scrolled with a parallax effect.
new vanillaJsuParallax({ items: document.querySelectorAll('.el1, .el2') });
Adjust the scrolling direction using the data-jsuplxdir
attribute as this:
<!-- Scroll to bottom --> <span class="el" data-jsuplxdir="bottom"><span>
Adjust the perspective in pixels using the data-jsuplxperspective
attribute:
<span class="el" data-jsuplxperspective="300"><span>
Changelog:
v0.4.1 (06/24/2018)
- fix placement issue that occurs when append-to is “parent” and parent element is a flexbox