javascript - 使用 jQuery.animate 增加一个以上的数字

Question

我有一个从零动画到其值的脚本。是否可以一次将这个数字增加一个以上？

例如 1, 5, 10, 15...... 100

jQuery({ countNum: 0 }).animate({ 
  countNum: jQuery('.ticker').text()
}, {
  duration: 2000,
  easing: 'swing',
  step: function() {  
    jQuery('.ticker').text((Math.floor(this.countNum)));
  },
  complete: function() {  
    jQuery('.ticker').text((Math.floor(this.countNum)));
  },
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="ticker">100</div>

标签： javascriptjqueryjquery-animate

Answer 1

你可以这样做：HTML：

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="ticker">100</div>

JS：

jQuery({ countNum: 0 }).animate(
  {
    countNum: jQuery(".ticker").text()/5
  },
  {
    duration: 4000,
    easing: "linear",
    step: function () {
      jQuery(".ticker").text(Math.floor(this.countNum)*5);
    },
    complete: function () {
      jQuery(".ticker").text(Math.floor(this.countNum)*5);
    }
  }
);