Fork me on GitHub

NumScroller

jQuery plugin for number increment rolling animation when it becomes visibile while scrolling

Intro

NumScroller is a jQuery plugin for number increment rolling animation when it becomes visibile while scrolling.

Usage Documentation

Download and include the jQuery library and the NumScroller plugin in your web page.

<script src="jquery.min.js"></script>
<script src="jquery.numscroller-1.0.js"></script>
        

Now in the HTML code, write the number with a class 'numscroller' as described below to get rolling animation, when it becomes visible in the screen while scrolling.


<span class='numscroller' data-min='1' data-max='1000' data-delay='5' data-increment='10'>1000</span>
        


Examples

Charles Babbage designs his first mechanical computer in
0
Tim Berners-Lee at CERN releases first website in
0
Total no. websites as of 2014,
0
No of internet users world wide as of 2014,
0
No. blood vessels in human body,
0
No. of heart beats for one day,
0

Options

The tag with 'numscroller' class can have below attributes to customize the behaviour,

data-min Start number for increment rolling
data-max End number for increment rolling
data-increment Increment by value for each rolling
data-delay Total seconds to complete the number increment rolling

About

NumScroller is a jQuery plugin developed by Arun David & Boobalan to use it in our website DoPartTime.com.