jQuery Numerator - Easily animate numbers

jQuery Numerator is a jQuery plugin to easily animate numbers.

Features:

• Easing options.
• Allows to specify the length of the animation.
• Custom decimal places and delimiter.
• Callback events supported (onStar, onStep, and onComplete).

• denizli escort
• denizli escort
• didim escort
• düzce escort
• edirne escort
• edirne escort
• edremit escort

Source: github.com

1. INCLUDE JS FILES

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="jquery-numerator.js"></script>

2. HTML

<div id="demo-display">
     <p>50</p>
</div>

3. JAVASCRIPT

$('#demo-display p').numerator({
	easing: 'linear', // easing options.
	duration: 2000, // the length of the animation.
	delimiter: ',',
	rounding: 2, // decimal places.
	toValue: 100 // animate to this value.
});

4. 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')
}