🔔 Alert..!! Get 2 Month Free Cloud Hosting With $200 Bonus From Digital Ocean ACTIVATE DEAL

Numerator is yet another jQuery number animation plugin that allows you to add customizable animations to the numbers.

count-up

Documentation

jQuery Numerator

A jQuery plugin to easily animate numbers.

Demo page

http://garethdn.github.io/jquery-numerator/

Installation

Include script after the jQuery library:

<script type="text/javascript" src="/path/to/jquery-numerator.js"></script>

Usage

$('.my-value').numerator( options )

Options

easing (string)

An optional parameter to specify the animation easing. Defaults to swing.

easing: 'linear'

duration (number)

An optional parameter specifying the length of the animation in milliseconds (ms). Defaults to 500 (1/2 a second).

duration: 2000

delimiter (string)

An optional parameter specifying character(s) used to delimit thousands values.

delimiter: ','

rounding (number)

This parameter specifies the number of decimal points to display. Defaults to 0.

rounding: 2

toValue (number)

The final value that you want the number to be animated to.

toValue: 205

onStart (function)

A function to be called when the animation beings.

onStart: function(){ 	alert('Animation started') }

onStep (function)

A function to be called at each step of the animation. Accepts two arguments, now and fx.

onStep: function(now, fx){ 	alert('The current value is: ' + now) }

onComplete (function)

A function to be called when the animation is complete.

onComplete: function(){ 	alert('The animation is now complete') }

TODO

  • Implement queue functionality
  • Publish bower package
  • Publish NPM package

License

MIT License (c) Gareth Nolan


You May Also Like