countUp.js is a dependency-free, lightweight JavaScript "class" that can be used to quickly create animations that display numerical data in a more interesting way.
Despite its name, countUp can count in either direction, depending on the startVal
and endVal
params that you pass. Bower and Component .json files are included, as well as a coffeescript version, thanks to @HHSnopek.
countUp.js supports all browsers.
Params:
target
= id of html element or var of previously selected html element where counting occursstartVal
= the value you want to begin atendVal
= the value you want to arrive atdecimals
= number of decimal places in number, default 0duration
= duration in seconds, default 2
var numAnim = new countUp("SomeElementYouWantToAnimate", 24.02, 99.99, 2, 1.5);
numAnim.start();
with optional callback:
numAnim.start(someMethodToCallOnComplete);
Stop an animation in progress:
numAnim.stop();
Resume a stopped animation:
numAnim.resume();
Reset an animation:
numAnim.reset();