During a project recently we were tasked with demonstrating a number counting up in the way of rolling. A good way to describe the action is how you would see an old gas pump price or vehicle odometer counting miles.

The following is an example of how to do that…

The first thing you have to do is download the file package from https://github.com/HubSpot/odometer

Add the following to your site header (adjusted to where the respective file locations are on your page/site). Select the theme that works best with your web-page.

Add the following to your site footer (adjusted to where the respective file locations are on your page/site).

Then when you know the location of the rolling number, add a class that you can call back through your custom js file and in the HTML add the number you want to start from (ex. 0)

Finally you will need to add the the number you would like to count to in your custom script

For more documentation and examples please see the hubspot page by Adam Schwartz and Zack Bloom http://github.hubspot.com/odometer/docs/welcome/