Переменная длительности CSS-анимации не будет обновляться - PullRequest
1 голос
/ 01 октября 2019

Я делаю анимацию сердечного ритма с реальными данными (БИТ В МИНУТУ).

transform: rotate(45deg);
animation: animateHeart 0s infinite;

Это моя анимация:

@keyframes animateHeart {
  0% {
    transform: rotate(45deg) scale(0.8);
  }
  5% {
    transform: rotate(45deg) scale(0.9);
  }
  10% {
    transform: rotate(45deg) scale(0.8);
  }
  15% {
    transform: rotate(45deg) scale(1);
  }
  50% {
    transform: rotate(45deg) scale(0.8);
  }
  100% {
    transform: rotate(45deg) scale(0.8);
  }
}

Когда я делаючто-то вроде этого внутри метода:

const duration = (60 / BPM);
document.getElementById('heart').style.animationDuration = duration.toFixed(2) + 's';

Он будет выполняться только один раз.

Может кто-нибудь помочь, пожалуйста.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...