jquery实现 数字变化效果

Posted 2022-01-04 dandan9999

一、

装修预算报价为  4476  元

材料费  1119 元

人工费  1119 元

设计费  1119 元

质检费  1119 元

代码：

setInterval(function () 
    var material=Math.random()*(2000-1119+1)+1119;
    material=Math.round(material);
    $(".material").html(material);

    var people=Math.random()*(2000-1119+1)+1119;
    people=Math.round(people);
    $(".people").html(people);

    var design=Math.random()*(2000-1119+1)+1119;
    design=Math.round(design);
    $(".design").html(design);

    var quality=Math.random()*(2000-1119+1)+1119;
    quality=Math.round(quality);
    $(".quality").html(quality);

    var maxfont=material+people+design+quality;
    $(".maxfont").html(maxfont);
,500);

Math.random()*(2000-1119+1)+1119;  得到1119-2000之间的一个随机值
二、从0-10 滚动

<h1 id="numBox"></h1>

<script>
    function numRunFun(num, maxNum)
        var numBox = document.getElementById("numBox");
        var num = num;
        var maxNum = maxNum;
        var timer = setInterval(function()
            num++; // 调节速度
            if(num >= maxNum)
                numBox.innerHTML = maxNum;
                clearInterval(timer);
             else 
                numBox.innerHTML = num;
            
        ,100); // 也可以调节速度
    
    // 运行
    numRunFun(0,10);
</script>