上次在项目中实现数字增长的效果,实现了从0个数字到
目标数的增加,看到效果图。
现在
扩展它可以产生不同的效果。
其主要思想是两部分。
1。每增加三个数字,
2。移动
1用普通的东西很方便。
this.fomatnum =
功能(NUM){
var str = num.tofixed(这个
选项。小数); / /精确到小数
VaR num1,X1,X2,REG;
ARR = str.split(,);
X1 = ARR { 0 };
X2 = arr.length + ARR { 1 } > 1。:;
注册表( +)( { 3 });
如果(这个选项。isfomat){
而(reg.test(X1)){
X1 = x1.replace(REG,1美元+
}
}
如果(这个选项。isfomat){
返回this.option.prefix + X1 + X2;
{人}
返回this.option.prefix + STR;
}
}
为了达到效果,你可以使用requestanimationframe
方法,然后
处理兼容性。
var =
函数(){()
VaR(1,P = math.min(新)
日期(。时间)-(,StartTime) /。选项。持续时间); / /当前时间减去开始时间,然后除以总时间,Math.min,两个数最小。
VaR号= that.num * P;
that.elm.innerhtml = that.fomatnum(that.num * P);
如果(p<1){ / /
RequestAnimationFrame(function(){()
变化();
});
{人}
cancelanimationframe(变化);
}
}
RequestAnimationFrame(function(){()
变化();
});
如果你想在视觉
区域实现数字的效果,你可以在视觉区域监控DOM,然后调用它。
以上是本文的全部内容,如果有问题欢迎您来讨论留言,并谢谢您的
支持。