block by bycoffe 3763844

3763844

Full Screen

index.html

<!doctype html>
<html>
  <head>
    <style type="text/css">
      #number {
        font-family: Helvetica, Arial, sans-serif;
        font-size: 100px;
      }
    </style>
  </head>
  <body>

    <div id="number">0</div>

    <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
    <script type="text/javascript" src="jQuery.tickTo.js"></script>
    <script type="text/javascript">
      $(document).ready(function () {
          $("#number").tickTo(50, 100, 1, function () {
            alert('Done counting!')
          });
      });
    </script>
  </body>
</html>

jQuery.tickTo.js

(function ($) {
  $.fn.tickTo = function (max, delay, increment, callback) {
    return this.each(function () {
      var $this = $(this);

      var min = parseInt($this.html());

      if (min === max) return

      if (!delay) delay = 20;

      if (!increment) increment = 1;

      var curr = min;

      var tick = function () {
        if (curr >= max) {
          if (typeof callback === 'function') {
            return callback.call(this);
          } else {
            return;
          }
        }
        curr += increment;
        $this.html(curr);
        setTimeout(tick, delay);
      };

      tick();

    });
  };
})(jQuery);