zoukankan      html  css  js  c++  java
  • 纯数字逐一停止显示效果

    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);

    效果纯数字逐一停止显示效果,比如这个个数字不停的变化,第一位先定下来,第二位再确定,然后第三位再确定下来。因为项目用了几天废弃,所以存下档。

  • 相关阅读:
    display
    盒子模型
    css样式
    修改页面标题前的图标
    form表单
    html中列表
    代码书写格式
    dw中的超链接
    硬盘的访问,程序重定位和加载
    Bochs调试指令
  • 原文地址:https://www.cnblogs.com/qianshui/p/5283565.html
Copyright © 2011-2022 走看看