NaN Producing Misery

    enter-view

    2.0.1 • Public • Published

    enter-view

    Dependency-free JavaScript library to detect when element enters into view. See demo. It uses requestAnimationFrame in favor of scroll events for less jank. Less than 1kb minified + gzipped.

    Installation

    Old school (exposes the enterView global):

    <script src="https://unpkg.com/enter-view"></script>

    New school:

    npm install enter-view --save

    And then import/require it:

    import enterView from 'enter-view'; // or...
    const enterView = require('enterView');

    Usage

    enterView({
    	selector: '.class-name',
    	enter: function(el) {
    		el.classList.add('entered');
    	}
    });
    
    enterView({
    	selector: '.class-name',
    	enter: function(el) {
    		el.classList.add('entered');
    	},
    	exit: function(el) {
    		el.classList.remove('entered');
    	},
    	progress: function(el, progress) {
    		el.style.opacity = progress;
    	},
    	offset: 0.5, // enter at middle of viewport
    	once: true, // trigger just once
    });
    

    Options

    selector: [string or array of elements] required

    Takes a class, id, or array of dom elements.

    enter: [function] optional

    Callback function that returns the element that was entered.

    exit: [function] optional

    Callback function that returns the element that was exited.

    progress: [function] optional

    Callback function that returns the element that was progressed through, and a value between 0 and 1 of how far through the element progress has been made.

    offset: [number] optional (defaults to 0)

    A value from 0 to 1 of how far from the bottom of the viewport to offset the trigger by. 0 = top of element crosses bottom of viewport (enters screen from bottom), 1 = top of element crosses top of viewport (exits screen top).

    once: [boolean] optional (defaults to false)

    Whether or not to trigger the callback just once.

    Contributors

    Install

    npm i enter-view

    DownloadsWeekly Downloads

    2,371

    Version

    2.0.1

    License

    MIT

    Unpacked Size

    16.4 kB

    Total Files

    7

    Last publish

    Collaborators

    • russellsamora