jquery.counterup is a lightweight jQuery plugin that counts up to a targeted number when the number becomes visible.
npm install jquery.counterupjquery.counterup
==========
jquery.counterup is a jQuery plugin that animates a number from zero (counting up towards it). It supports counting up:
* integers 12345
* floats 0.1234
* formatted numbers 1,234,567.00
* time 21:45:00
Features:
* Auto-detect for integers, floats or formatted numbers.
* The plugin will also use the number of decimal places the original number is using.
* Start counter with a different duration and delay by setting data-counterup-time="" and data-counterup-delay="".
* Lets you use your own formatter.
* Lightweight: ~1kb
* Minimal setup
Requires waypoints.js
Demo
====
Install with Bower
```
bower install jquery.counterup
=====
Include
``
HTML
With default values from plugin instantiation.
``
1,234,567.00
$1.99
12345data
With values from attribute.``
1,234,567.00
jQuery
``
$('.counter').counterUp();
or with extra parameters
``
$('.counter').counterUp({
delay: 10,
time: 1000,
offset: 70,
beginAt: 100,
formatter: function (n) {
return n.replace(/,/g, '.');
});
});
delay - The delay in milliseconds per number count up
time - The total duration of the count up animation
offset - The viewport percentile from which the counter starts (by default it's 100, meaning it's triggered
at the very moment the element enters the viewport)
beginAt - The number from which to count up
formatter` - A callback to format the number with