Minimal Number Increment Animation In JavaScript

Category: Javascript | January 27, 2021
Author: louis-young
Views Total: 770 views
Official Page: Go to website
Last Update: January 27, 2021
License: MIT

Preview:

Minimal Number Increment Animation In JavaScript

Description:

A configurable counter JavaScript library for incrementing numbers on the page.

How to use it:

1. Import the main script into the document.

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

2. Create a new instance of the counter.

<span class="example"></span>
const counter = new Counter(".example");

3. Config the counter using the following HTML data attributes:

  • data-counter-min: Min value
  • data-counter-max: Max value
  • data-counter-speed: Animation speed
  • data-counter-increment: Step size
  • data-counter-delay: Delay in milliseconds
<span class="example" 
      data-counter-min="1" 
      data-counter-max="1000" 
      data-counter-speed="25" 
      data-counter-increment="1" 
      data-counter-delay="0">
</span>

You Might Be Interested In:


Leave a Reply