Animated Counter Plugin With jQuery And GSAP - lem_counter

File Size: 395 KB
Views Total: 4382
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
Animated Counter Plugin With jQuery And GSAP - lem_counter

lem_counter is a small yet configurable jQuery animated counter plugin for counting up or count down to a number you specify. The fast & performant count animation based on the GSAP's TweenLite.js library.

How to use it:

1. Load the needed jQuery nad TweenLite libraries in the html file.

<script src=""></script>
<script src=""></script>

2. Load the lem_counter plugin's script lem_counter.js after jQuery.

<script src="lem_counter.js"></script>

3. Create a container where you want to display the animated counter.

<div class="myCounter"></div>

4. Call the function on the container element and specify the target number you want to count to.

  value_to: 100

5. Specify the value you want to countdown from.

  value_to: 100,
  value_from: 500

6. You can also specify the target number directly in the container element.

  value_to_from_content: true
<div class="myCounter">

7. To config the animation counter using the data attribute:

<div class="myCounter"
     data-lem-counter='{"value_from": 200, "value_to": 100'>

8. All default configuration options.

  value_from: 0,
  value_to: 0,
  locale: false, // e.g. 'en-US'
  value_to_from_content: false,
  animate_duration: 2

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