Increment / Decrement Numeric Values – drain.js

Preview:

Description:

drain.js is a tiny JavaScript library for animating numbers from a number to a new one.

How to use it:

1. Install and import the drain.js library.

# NPM
$ npm i drain-js

import drain from 'drain-js';

// or
import drain from "https://cdn.skypack.dev/drain-js";

2. Create a new instance of the drain.js and specify the start/end values as follows:

drain({ 
  start: 100, 
  end: 1000, 
});

3. Execute a function on each tick.

drain({ 
  start: 100, 
  end: 1000, 
  onInterval: function(val){
    // do something
  }
});

4. Execute a function after the animation has ended.

drain({ 
  start: 100, 
  end: 1000, 
  onComplete: function(){
    // do something
  }
});