好用的数字滚动插件

插件特效

2026-07-25 22:58 2 次浏览 • 0 次下载 2.3KB

插件描述：简单灵活好用,不依赖其它库,js采用了ES6编写，尽量使用chrome浏览器来查看，可以使用babel转成ES5，或者通过babel的网站在线转换。动画使用css3。

以下是调用接口

var odo1 = new Odometer('.Odometer',{
    len : null, //设置默认位数
    num : "", //初始化值
    speed : 1000, //动画速度
    symbol : '', //分割符
    dot : 0 //保留几位小数点 
});
odo1.update(123)  //更新数字

以下是基本的css

.number-animate{line-height:45px; height: 45px;font-size: 40px;overflow: hidden; display: inline-block; position: relative; }
.number-animate .number-animate-dot{ width: 21px; float: left; text-align: center;}
.number-animate .number-animate-dom{ width: 27px;  text-align: center; float: left; position: relative; top: 0;}
.number-animate .number-animate-dom span,.number-animate .number-animate-dot span{float: left;width: 100%;height: 45px;line-height: 1;}