Продолжительность подсчета до большого числа

Я пытаюсь установить длительность моего счетчика, чтобы он был медленным, не имея большого числа длин, установленного в коде, например:

duration: 99999;

Первоначально у меня был счетчик, установленный на низкое число, но счет должен достигнуть 1,000,000,00, но я хочу иметь возможность контролировать, насколько быстро это учитывается.

Вот как я сейчас его настроил.

<div class="counter" data-count="1000000">0</div>

и мой JS выглядит следующим образом:

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

$({ countNum: $this.text()}).animate({
countNum: countTo
},

{

duration: 99999,
easing:'linear',
step: function() {
  $this.text(Math.floor(this.countNum));
}
});  
});

Я младший, поэтому любые другие рекомендации будут оценены.

благодаря

javascript,jquery,html,counter,

1

Ответов: 1


2 принят

Если вы хотите установить, как быстро делается подсчет, вы можете попробовать установить продолжительность (которая измеряется в миллисекундах), чтобы соответствовать countToзначению. Например, если вы хотите приращение быть сделано каждым вторым, сделайте следующее : duration: parseInt(countTo)*1000.

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

  $({
    countNum: $this.text()
  }).animate({
    countNum: countTo
  }, {
    duration: parseInt(countTo) * 1000,
    easing: 'linear',
    step: function() {
      $this.text(Math.floor(this.countNum));
    },
    complete: function() {
      // Ensure that the final value is updated correctly
      // ... especially when using very short durations
      $this.text(this.countNum);
    }
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="counter" data-count="1000000">0</div>

JavaScript, JQuery, HTML, счетчик,
Похожие вопросы