js純數(shù)字逐一停止顯示效果的實(shí)現(xiàn)代碼
js純數(shù)字逐一停止顯示效果的實(shí)現(xiàn)代碼
function showScore($ele, num, secand, pause){ //second 按照秒數(shù),動(dòng)畫(huà)運(yùn)行多少秒
if (!secand) { secand = 2;}
if (!pause) { pause = 20;}
var len = String(num).length;
var temnum, times = 0 , stepTimes, max ;
var numArr = String(num).split("");
function getRandom(n){
var num = Math.floor(Math.random()*(Math.pow(10, n)-1 - Math.pow(10, n-1))+Math.pow(10, n-1));
if (String(num).length !== n) {num = getRandom(n);}
return num;
}
function setValue(num, pause, secand){//second 運(yùn)行多少秒后停止
var len = String(num).length, j=0;
if (!stepTimes) {
max = Math.ceil(secand*1000/len);
stepTimes = Math.ceil(max/pause);
}
temnum = "";
setTimeout(function(){
for (var i = 1; i <= len; i++) {
if (times >= stepTimes*i) {
j++;
temnum += numArr[i-1]+"";
}else{
break;
}
};
if (j < len) {
$ele.html(temnum+""+getRandom(len-j));
}else{
$ele.html(temnum);
}
if (times >= max || j >= len) {return;};
setValue(num, pause, secand);
times++;
}, pause);
}
setValue(num, pause, secand);
}
showScore($(".num"), 2344, 1.5, 10);

效果純數(shù)字逐一停止顯示效果,比如這個(gè)個(gè)數(shù)字不停的變化,第一位先定下來(lái),第二位再確定,然后第三位再確定下來(lái)。因?yàn)轫?xiàng)目用了幾天廢棄,所以存下檔。
以上這篇js純數(shù)字逐一停止顯示效果的實(shí)現(xiàn)代碼就是小編分享給大家的全部?jī)?nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持腳本之家。
相關(guān)文章
用JavaScript事件串連執(zhí)行多個(gè)處理過(guò)程的方法
用JavaScript事件串連執(zhí)行多個(gè)處理過(guò)程的方法...2007-03-03
jquery 滾動(dòng)條事件簡(jiǎn)單實(shí)例
這篇文章介紹了jquery滾動(dòng)條事件的簡(jiǎn)單實(shí)例,有需要的朋友可以參考一下2013-07-07
JavaScript 異步調(diào)用框架 (Part 4 - 鏈?zhǔn)秸{(diào)用)
我們已經(jīng)實(shí)現(xiàn)了一個(gè)簡(jiǎn)單的異步調(diào)用框架,然而還有一些美中不足,那就是順序執(zhí)行的異步函數(shù)需要用嵌套的方式來(lái)聲明。2009-08-08
JavaScript原生對(duì)象之String對(duì)象的屬性和方法詳解
這篇文章主要介紹了JavaScript原生對(duì)象之String對(duì)象的屬性和方法詳解,本文講解了length、charAt()、charCodeAt()、concat()、indexOf()、lastIndexOf()等方法屬性,需要的朋友可以參考下2015-03-03
基于HTML+CSS+JS實(shí)現(xiàn)紙牌記憶游戲
這篇文章主要介紹了如何利用HTML、CSS?和?JavaScript?制作紙牌記憶游戲,文中的示例代碼講解詳細(xì),感興趣的小伙伴可以跟隨小編一起動(dòng)手嘗試一下2022-04-04
判斷是否存在子節(jié)點(diǎn)的實(shí)現(xiàn)代碼
下面小編就為大家?guī)?lái)一篇判斷是否存在子節(jié)點(diǎn)的實(shí)現(xiàn)代碼。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-05-05
20個(gè)JS簡(jiǎn)寫(xiě)技巧提升工作效率
這篇文章主要介紹了20個(gè)JS簡(jiǎn)寫(xiě)技巧提升工作效率,本文特點(diǎn)以言簡(jiǎn)意賅為主,圍繞JS簡(jiǎn)寫(xiě)技巧的話題展開(kāi)全文,具有一定的查看價(jià)值 ,需要的小伙伴可以參考一下2021-12-12
微信小程序利用云函數(shù)獲取手機(jī)號(hào)碼
這篇文章主要介紹了微信小程序利用云函數(shù)獲取手機(jī)號(hào)碼功能,本文通過(guò)實(shí)例代碼給大家講解的非常詳細(xì),具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2019-12-12

