Countador is a javascript component that depends on jQuery
This counter features a (up/down)wards count to a specified number at
a specific rate, to use it, include countador.js
and countador.css
in your code, and when DOMReady initialize it like this:
Countador.init({
selector: '#counter',
digits: 7,
url: 'web_assets/contadordata.json',
endNumber: 1000000,
pollInterval: 240000,
onEnd: function() {
$('#counter').after('<br><br><h2>FINISHED COUTING!</h2>');
}
});
The selector is where the counter will be inserted, and the digits is the number of 'boxes' that the counter will have.
It goes until the endNumber
and then executes the onEnd
callback.
Each pollInterval
milliseconds it does an ajax call to the server
to get a file with the real number and the corrected growth rate.
The format of the file is:
{
"number": "999482",
"rate": "4000"
}
Where number is the actual number of the count in the server, and rate
is the amount to increase/decrease per hour.
( Yes, it can be negative, like "-4000" )
Dependencies
For this to work we need jQuery and Modernizr with csstransforms, csstransforms3d and csstransitions.