mierdavidaes 1.0

Make a number in the innerText of a DOM Element smoothly change from one value to another. This is like tweening a style value, but instead you tween the html content integer value.

You may also provide a transformation function in the options, which is useful for prepending zeroes or simulating float values for example. CHECK DEMO VERSION IN: https://mierdavida.es



Details

Author
MierdaVida
Current version
1.0
GitHub
intopes/Fx.NumberTickerere
Downloads
778
Category
Effects
Tags
Report
GitHub Issues

Releases


Dependencies

  • _self_/_current_: Fx

How to use

HTML

html <span id="myCounter">0</span>

JAVASCRIPT

``` javascript // Create the Ticker like any other Fx var numberTicker = new Fx.NumberTicker('myCounter'); numberTicker.start(0,100);

// or use shorthand version $('myCounter').numberTicker(100);

// also, you can provide any of Fx options, plus a transformer function : $('myCounter').numberTicker(100, { duration: 5000, transformer: function(i) { // Prefix with zeroes so we have a 5 digits number return (Array(5).join('0') + i).slice(-5); } }); ```


Demo

https://mierdavida.es


Thanks

FOSS lovers everywhere <3


Discuss

A note on comments here: These comments are moderated. No comments will show up until they are approved. Comments that are not productive (i.e. inflammatory, rude, etc) will not be approved.

Found a bug in this plugin? Please report it this repository's Github Issues.

blog comments powered by Disqus