JavaScript 數字動態動畫
阿新 • • 發佈:2020-07-24
在日常需求中會不會出現一些奇奇怪怪的需求,比如:動態數字
這裡的動態數字其實是一個數字懂最小值到設定值的一個動畫過程
也是基於jQuery選擇器的啦,js下載地址:animationNumber.js
需要依賴幾個小工具哦
JavaScript 小工具前置 js
1.計時器
2.UUID
3.原地自閉包
其公開兩種使用方式
animationNumber(setting);
$.fn.animationNumber(command,option);
其中
setting={ from:0,//減少的值 to:0,//最終目標值 speed:0,//速度 refreshInterval:100,//計時器速度 decimals:0,//小數點 target:"#xxx"//選擇器, onUpdate:null,//每次數字變更的回撥事件 onComplete:null,//完成回撥事件 } command="start|stop|reset" option={ from:0,//減少的值 to:0,//最終目標值 speed:0,//速度 refreshInterval:100,//計時器速度 decimals:0,//小數點 onUpdate:null,//每次數字變更的回撥事件 onComplete:null,//完成回撥事件 }
animationNumber(setting)方法下存在三個方法分別為start開始,stop停止,reset重置