Tiny Animated Counter Plugin With jQuery - Incremental Number

File Size: 4.48 KB
Views Total: 7096
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Tiny Animated Counter Plugin With jQuery - Incremental Number

Incremental Number is a very small jQuery counter plugin which allows counting up to a specified number in an animated way.

How to use it:

1. First you have to add jQuery library and the script incrementalNumber.js to your html page.

<script src="jquery.min.js"></script>
<script src="incrementalNumber.js"></script>

2. Next, simply add the class incrementalNumber to the tag of the number. This will search for all the tags with this class. And then you have to pass the number as a parameter in data-value attribute.

<span class="incrementalNumber" data-value="100" ></span>

3. Finally, dont forget to call the function incrementalNumber when the document is ready!

incrementalNumber();

4. If the number is to big, you can add the parameter big-Number and de count start 10% less the total.

<span class="incrementalNumber" big-number data-value="2500"></span>

5. If the number is more big, you can especificate the start number like this:

<span class="incrementalNumber" big-number="19800" data-value="20000"></span>

6. You can add text to the end with the parameter set-text.

<span class="incrementalNumber" set-text="%" data-value="100"></span>

7. The last option can set the total time of the "animate" with set-time in ms .

<span class="incrementalNumber" set-time="3000" data-value="100"></span>

This awesome jQuery plugin is developed by Joker9090. For more Advanced Usages, please check the demo page or visit the official website.