JS/jQuery号增加动画

Question

假设我有一个.number包含数字的div .

我想提高这个数字到一个新的动态,像这样一个计数器增加影响一个在底部.

任何轻量级解决方

谢谢

Answer 1

$(function() {
  var ele = $('#haha');
  var clr = null;
  var rand = (Math.random() * 100000) >> 0;
  (loop = function() {
    clearTimeout(clr);
    (inloop = function() {
      ele.html(rand+=1);
      if(!(rand % 50)) {
        return;
      }
      clr = setTimeout(inloop, 30);
    })(); 
    setTimeout(loop, 2500);
  })();
});

DEMO

编辑 :

$(function () {
    var ele = $('#haha');
    var clr = null;
    var rand = Math.floor(Math.random() * 100000); // just a random number(initial number)
    loop();
    function loop() {
        clearTimeout(clr);
        inloop();
        setTimeout(loop, 2500); //call 'loop()' after 2.5 seconds
    }
    function inloop() {
        ele.html(rand += 1);
        if (!(rand % 50)) {
            return;
        }
        clr = setTimeout(inloop, 30); //call 'inloop()' after 30 milliseconds
    }
});

$(function() {
  var ele = $('#haha');
  var clr = null;
  var rand = (Math.random() * 100000) >> 0;
  (loop = function() {
    clearTimeout(clr);
    (inloop = function() {
      ele.html(rand += 1);
      if (!(rand % 50)) {
        return;
      }
      clr = setTimeout(inloop, 30);
    })();
    setTimeout(loop, 2500);
  })();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="haha"></div>