Атрибут elapsedTime события AnimationEvent

События DOM AnimationEvent

Определение и использование

Атрибут elapsedTime возвращает количество секунд, которые уже прошли у анимации, при возникновении анимационного события.

Комментарии:Если анимация приостановлена (с помощью CSS-атрибута animation-delay), значение возвращается не受到影响.

Комментарии:Для Событие animationstartЭтот атрибут всегда возвращает "0".

Комментарии:Этот атрибут только для чтения.

Пример

Определить, сколько секунд выполнялась анимация:

var x = document.getElementById("myDIV");
x.addEventListener("animationiteration", myRepeatFunction);
function myRepeatFunction(event) {
  this.innerHTML = "Время выполнения: " + event.elapsedTime;
}

Попробуйте сами

Синтаксис

event.elapsedTime

Технические детали

Возвратное значение: Числовое значение, представляющее количество секунд, в течение которых выполняется анимация.

Поддержка браузерами

Числа в таблице указывают на первую версию браузера, которая полностью поддерживает это свойство.

Свойства Chrome IE Firefox Safari Opera
elapsedTime Поддержка 10.0 6.0 Поддержка Поддержка

Соответствующие страницы

Руководство по HTML DOM:Событие animationstart

Руководство по HTML DOM:Событие animationiteration

Руководство по HTML DOM:Событие animationend

Руководство по HTML DOM:Свойство animationName события AnimationEvent

Руководство по CSS:Свойство animation CSS3

Руководство по CSS:Свойство animation-duration CSS3

События DOM AnimationEvent