jquery.countup.js
jquery.countup.js 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
Features:
- Auto-detect for integers, floats or formatted numbers
- The plugin will also use the number of decimal places the original number is using.
- Lightweight: ~1kb
- Minimal setup
Install
You can use npm or bower.
npm install jquery.countup.js or
bower install jquery.countup.js Dependencies
Package dependencies: jquery and waypoints.
Usage
Includes
<script src="jquery.min.js"></script> <script src="jquery.waypoints.min.js"></script> <script src="jquery.countup.min.js"></script>HTML
<span class="counter">1,498,547.00</span> <span>$</span><span class="counter">7.99</span> <span class="counter">1455455</span>You can use data-counter-time and data-counter-delay.
<span class="counter" data-counter-time="5000" data-counter-delay="50">1981</span><br><br><br> <span class="counter" data-counter-time="100" data-counter-delay="20">9842</span><br><br><br>Jquery
$('.counter').countUp(); or with extra parameters (default options)
$('.counter').countUp({ delay: 10, time: 2000 }); delay- The delay in milliseconds per number count uptime- The total duration of the count up animation
Note: These values are overwritten with data elements.
Social Stuff
- Website: http://agmstudio.io/
- Twitter: @AGMStudio_io