node package manager

properjs-stagger

Stagger

A stepped timeout manager.

Installation

npm install properjs-stagger --save-dev

Usage

This is a nice utility for staggering animations in sequence.

var Stagger = require( "properjs-stagger" );
var elements = document.querySelectorAll( ".js-anim" );
var stagger = new Stagger({
    // How many iterations to run 
    steps: 10,
    // How long to timeout between each one 
    delay: 100
 
})
.step(function ( i ) {
    // Do something on each step 
    // i === current step number 
 
    // For instance, animate via a className 
    elements[ i ].className = "is-active";
})
.when( 5, function () {
    // Do something on a specific step 
    // In this case, on the 5th step iteration 
})
.done(function () {
    // Do something when the iterations end 
});
 
// Start the step iterations 
stagger.start();
 
// Pause the iterations 
stagger.pause();
 
// Resume the iterations 
stagger.play();