Событие animationiteration
Пример
Сделайте что-нибудь с элементом <div>, когда анимация CSS повторяется:
var x = document.getElementById("myDIV");
// Код для Chrome, Safari Opera
x.addEventListener("webkitAnimationIteration", myRepeatFunction);
// Стандартный синтаксис
x.addEventListener("animationiteration", myRepeatFunction);
Попробуйте сами »
Определение и использование
Событие animationend
происходит, когда анимация CSS завершена.
Для получения дополнительной информации о CSS-анимации смотрите CSS3 Анимации.
Когда воспроизводится анимация CSS, могут произойти три события:
- animationstart - происходит, когда анимация CSS началась
- animationiteration - происходит, когда анимация CSS повторяется
- animationend - происходит, когда анимация CSS завершена
Поддержка браузера
Цифры в таблице указывают на первую версию браузера, которая полностью поддерживает это событие.
Цифры, за которыми следует "webkit" или "moz", указывают первую версию, которая работала с префиксом.
Событие | |||||
---|---|---|---|---|---|
animationiteration | 4.0 webkit | 10.0 | 16.0 5.0 moz |
4.0 webkit | 15.0 webkit 12.1 |
Примечание
Для Chrome, Safari и Opera используйте префикс webkitAnimationIteration.
Синтаксис
object.addEventListener("webkitAnimationIteration", myScript); // Код для Chrome, Safari и Opera
object.addEventListener("animationiteration", myScript); // Стандартный синтаксис
Технические детали
Пузыри: | Да |
---|---|
Отменяемый: | Нет |
Тип события: | Событие Анимация |
DOM Версия: | События 3 уровня |
Связанные страницы
CSS Учебник: CSS3 Анимации
CSS Справочник: CSS3 Свойство анимации
CSS Справочник: CSS3 Свойство animation-iteration-count
HTML DOM Справочник: Свойство анимации стиля