0 730

js实现数值递增的效果


<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>js实现数字动态递增效果</title>
</head>
<body>
    <span id="span1">0</span>
    <script>
    //调用方法
    NumDynamic("span1",10,100);
    /**
    * 动态数字方法
    * ID    => 对应ID
    * speed => 递增速度 
    * value => 接入的数字
    */
    function NumDynamic(ID,speed,value){
    	var span1 = document.getElementById(ID);
    	if(value>0){
	    	var num = 0;
	        var t = setInterval(function(){
		       num++;
		       span1.innerText = num;
			        if(num==value){
			        	clearInterval(t);
			        }       
	        },speed);
    	}else{
    		span1.innerText = value;
    	}
    }	
	</script>
</body>
</html> 


[分类]
[来源] http://erlangyun.com/p/id/172.html
[声明] 本站资源来自用户分享,如损害你的权益请联系客服QQ:120074275给予处理。