天天看點

純數字逐一停止顯示效果

function showScore($ele, num, secand, pause){ //second  按照秒數,動畫運作多少秒
                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 運作多少秒後停止
                    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);      

效果純數字逐一停止顯示效果,比如這個個數字不停的變化,第一位先定下來,第二位再确定,然後第三位再确定下來。因為項目用了幾天廢棄,是以存下檔。