小程序实现倒计时计时器最后十秒只显示一位数并且加入放大动画效果-ppt倒计时小程序-小程序倒计时功能-即速应用

小程序实现倒计时计时器最后十秒只显示一位数并且加入放大动画效果-ppt倒计时小程序-小程序倒计时功能

浏览量：2006 时间：2020-04-06 来源：Archimelan

1.
效果：
2.
js：
varthat//用来实现最后十秒强调的动画varanimationwx.createAnimation({duration:300,timingFunction:'ease',})/***[倒计时函数，最后十秒只显示一个数字，且有放大动画效果]*@param{Number}minutes[分钟]*@param{Number}second[秒]*@param{function}TimeoutCallback[倒计时结束执行的函数]*/functioncountDown(minutes,second,TimeoutCallback){varinterval(){if(minutes0second0||second10){that.setData({time:minutes+':'+second--})}elseif(minutes0){minutes--;second59;that.setData({time:minutes+':'+second--})}elseif(second0){animation.scale(1.5,1.5).step()animation.scale(1,1).step()that.setData({time:second--,animationData:animation.export()})}else{clearInterval(timer)//倒计时结束回调if(typeofTimeoutCallback!'function'){return}TimeoutCallback()}}//因为定时器会延时一个间隔单位，所以先执行一次interval()vartimersetInterval(interval,1000)}Page({onLoad:function(){thatthiscountDown(1,5)}})3.
wxml：
viewstyle"display:inline-block;"animation"{{animationData}}"{{time}}/view