countUp.js是一款轻量级的、无依赖的js计数器动画特效插件。它能够帮助我们快速的通过多种方式创建计数器的动态变化效果。通过设置startVal
和endVal
参数,countUp 可以在任何一个方向上计数。countUp兼容新超强,兼容所有的浏览器。
可用参数
- target :html元素的id,可以是
input
元素、svg文本元素或者预先提供的元素选择器变量。 - startVal :计数器开始的数值。
- endVal :计数器结束的数值。
- decimals :计数器数值精度。默认值为0。
- duration :计数器动画持续时间,单位秒,默认值2。
- options :一个对象,决定计数器数值的格式和动画easing效果。
Decimals, duration 和 options可以使用默认值。
var numAnim = new countUp("SomeElementYouWantToAnimate", 24.02, 99.99); numAnim.start();
回调方法
numAnim.start(someMethodToCallOnComplete); // or an anonymous function numAnim.start(function() { // do something })
其它方法
停止计数器动画
numAnim.stop();
恢复计数器动画
numAnim.resume();
重置计数器动画
numAnim.reset();