Как сделать анимацию не только полосок, но и значений процентов?

Question

[olya_097]

80 /1 / 18
от 0 к нужному числу
https://codepen.io/Olya097/pen/BaojdEq

Comments

[olya_097]

Michael McGlyyn, глянете?
код ваш. Просто переделанный на jquery

[olya_097]

Michael McGlyyn, спасибо)

[olya_097]

Michael McGlyyn, на чистом возможно доправить?
https://codepen.io/Olya097/pen/mdJYmjz

[olya_097]

Michael McGlyyn, мне чисто интересно

Answer 1

[0xD34F]

$('.progress__item').each(function() {
  const $this = $(this);
  const $progressBar = $this.find('.progress__bar');
  const $value = $this.find('.progress__value');
  const value = $progressBar.data('progress-value');

  $progressBar.width(`${value}%`);

  $({ value: 0 }).animate({
    value,
  }, {
    duration: 1000,
    step: val => $value.text(`${val.toFixed(1)} %`),
  });
});

Comments

[olya_097]

0xD34F, спасибо , а тоже самое на JS возможно сделать ( анимацию не только полосок, но и значений процентов) ?

без jquery
https://jsfiddle.net/0e9q7wsn/

[0xD34F]

olya_097, https://jsfiddle.net/qktw6gLs/

Answer 2

[rasschitai]

делай на JS полностью, через таймер