Minimal Increasing Counter In jQuery - Countfect

File Size: 3.44 KB
Views Total: 5741
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Minimal Increasing Counter In jQuery - Countfect

Countfect is a super tiny jQuery increasing counter plugin that uses jQuery's animate() function to automatically count from 0 to a specified number.

See also:

How to use it:

1. Load the minified version of the Countfect jQuery plugin in the HTML.

<script src="/path/to/cdn/jquery.min.js"></script>
<script src="/path/to/src/countfect.min.js"></script>

2. Add the required CSS class countfect to the counter and determine the target number in the data-num attribute. That's it.

<span class="countfect" data-num="1200"></span>
<span class="countfect" data-num="1800"></span>
<span class="countfect" data-num="2400"></span>

3. Apply your own CSS styles to the counter.

.countfect { 
  font-family: 'Archivo Black'; 
  font-size: 2.5rem; 
  /* more styles here */
}

Changelog:

2021-04-26

  • Bugfix

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