稍微延迟即可启动计数器

时间:2019-01-21 15:43:28

标签: javascript jquery html css

当我重新加载我的网站时,计数器正在运行。我想像用户打开网站并向下滚动然后计数器开始运行时那样延迟一下。

$('.counter, .counterplus').each(function() {
  var $this = $(this),
    countTo = $this.attr('data-count');

  $({
    countNum: $this.text()
  }).animate({
    countNum: countTo
  }, {
    duration: 2000,
    easing: 'linear',
    step: function() {
      $this.text(Math.floor(this.countNum));
    },
    complete: function() {
      $this.text(this.countNum);
      //alert('finished');
    }
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="count">
  <div class="allcount">
    <div class="counter" data-count="100">0</div>
    <p>Customer support</p>
  </div>
  <div class="allcount">
    <div class="counterplus" data-count="115">0</div>
    <p>Happy Customers</p>
  </div>
  <div class="allcount">
    <div class="counter" data-count="100">0</div>
    <p>Client Satisfaction</p>
  </div>
</div>

0 个答案:

没有答案