Reveal Elements On Scroll – Vanilla Scroll Appear

Category: Javascript | October 4, 2018
Author: Spharian
Views Total: 966 views
Official Page: Go to website
Last Update: October 4, 2018
License: MIT

Preview:

Reveal Elements On Scroll – Vanilla Scroll Appear

Description:

A lightweight, native JavaScript library to reveal any elements when scrolling down the webpage. You can use this library to create a smart navigation that auto reveals on vertical page scrolling.

How to use it:

Load the main JavaScript library ‘scroll-appear.min.js’ in the document and the Vanilla Scroll Appear is ready for use.

<script src="scroll-appear.min.js"></script>

Create a new ScrollAppear instance and specify the target element to reveal on scroll.

new ScrollAppear(".element");

Config the ScrollAppear using HTML data attributes on the element:

  • data-appear-offset: distance from the top to trigger the reveal function.
  • data-appear-toggle-class: CSS class added to the element.
<div class="element"
    data-appear-offset="50"
    data-appear-toggle-class="your-class">
    ...
</div>

Changelog:

v3.0.9 (10/04/2018)

  • Refactor

You Might Be Interested In:


Leave a Reply