jQuery不断变化的数字滚动效果免费下载

jQuery不断变化的数字滚动效果,一款文字上下滚动很平滑的jQuery数字滚动插件,可用于制作网站会员数量、在线人数、访问量动态滚动展示代码。

JS代码

<script type="text/javascript"> 
    (function ($) { 
        /*jQuery对象添加  runNum  方法*/ 
        $.fn.extend({ 
            /* 
                *    滚动数字 
                *    @ val 值,    params 参数对象 
                *    params{addMin(随机最小值),addMax(随机最大值),interval(动画间隔),speed(动画滚动速度),width(列宽),height(行高)} 
            */ 
            runNum:function (val,params) { 
                /*初始化动画参数*/ 
                var valString = val || '70225800' 
                var par= params || {}; 
                var runNumJson={ 
                    el:$(this), 
                    value:valString, 
                    valueStr:valString.toString(10), 
                    width:par.width || 40, 
                    height:par.height || 50, 
                    addMin:par.addMin || 10000, 
                    addMax:par.addMax || 99999, 
                    interval:par.interval || 3000, 
                    speed:par.speed || 1000, 
                    width:par.width || 40, 
                    length:valString.toString(10).length 
                }; 
                $._runNum._list(runNumJson.el,runNumJson); 
                $._runNum._interval(runNumJson.el.children("li"),runNumJson); 
            } 
        }); 
        /*jQuery对象添加  _runNum  属性*/ 
        $._runNum={ 
            /*初始化数字列表*/ 
            _list:function (el,json) { 
                var str=''; 
                for(var i=0; i<json.length;i++){ 
                    var w=json.width*i; 
                    var t=json.height*parseInt(json.valueStr[i]); 
                    var h=json.height*10; 
                    str +='<li style="width:'+json.width+'px;left:'+w+'px;top: '+-t+'px;height:'+h+'px;">'; 
                    for(var j=0;j<10;j++){ 
                        str+='<div style="height:'+json.height+'px;line-height:'+json.height+'px;">'+j+'</div>'; 
                    } 
                    str+='</li>'; 
                } 
                el.html(str); 
            }, 
            /*生成随即数*/ 
            _random:function (json) { 
                var Range = json.addMax - json.addMin; 
                var Rand = Math.random(); 
                var num=json.addMin + Math.round(Rand * Range); 
                return num; 
            }, 
            /*执行动画效果*/ 
            _animate:function (el,value,json) { 
                for(var x=0;x<json.length;x++){ 
                    var topPx=value[x]*json.height; 
                    el.eq(x).animate({top:-topPx+'px'},json.speed); 
                } 
            }, 
            /*定期刷新动画列表*/ 
            _interval:function (el,json) { 
                var val=json.value; 
                setInterval(function () { 
                    val+=$._runNum._random(json); 
                    $._runNum._animate(el,val.toString(10),json); 
                },json.interval); 
            } 
        } 
    })(jQuery); 
</script> 
<script type="text/javascript"> 
    $("#test").runNum(52013141); 
</script>
恭喜,此资源为免费资源,请先
本站大部分下载资源收集于网络,只做学习和交流使用,版权归原作者所有! 若您需要使用非免费的软件、源码或服务,请购买正版授权并合法使用! 本站发布的内容若侵犯到您的权益,请联系站长删除,我们将及时处理! 本站所有资源均是收集而来,资源均不包含技术支持和安装服务!点击下载视为同意资源仅限学习使用。
打赏
下载价格:免费
下载说明:本站大部分下载资源收集于网络,只做学习和交流使用,版权归原作者所有! 若您需要使用非免费的软件、源码或服务,请购买正版授权并合法使用! 本站发布的内容若侵犯到您的权益,请联系站长删除,我们将及时处理! 本站所有资源均是收集而来,资源均不包含技术支持和安装服务!点击下载视为同意资源仅限学习使用。
0

评论0

请先

没有账号? 忘记密码?

社交账号快速登录