CSS animation-play-state Свойство
Пример
Приостановить анимацию:
div {
animation-play-state: paused;
}
Подробнее примеры ниже.
Определение и использование
Свойство animation-play-state
указывает, запущена ли анимация или приостановлена.
Примечание: Используйте это свойство в JavaScript для приостановки анимации в середине цикла.
Значение по умолчанию: | running |
---|---|
Inherited: | no |
Animatable: | no. Читайте о animatable |
Version: | CSS3 |
Синтаксис JavaScript: | object.style.animationPlayState="paused" |
Поддержка браузера
Номера в таблице указывают первую версию браузера, которая полностью поддерживает свойство.
Номера следуют -webkit-, -moz-, or -o- Укажет первую версию, которая работала с префиксом.
Свойство | |||||
---|---|---|---|---|---|
animation-play-state | 43.0 4.0 -webkit- |
10.0 | 16.0 5.0 -moz- |
9.0 4.0 -webkit- |
30.0 15.0 -webkit- 12.0 -o- |
Синтаксис CSS
animation-play-state: paused|running|initial|inherit;
Значения свойств
Значение | Описание | |
---|---|---|
paused | Указывает, что анимация приостановлена | |
running | Значение по умолчанию. Указывает, что анимация запущена | |
initial | Присваивает этому свойству значение по умолчанию. (Читайте о initial) | |
inherit | Наследует это свойство из родительского элемента. (Читайте о inherit) |
Похожие страницы
CSS Справочник: CSS Анимация
HTML DOM Справочник: animationPlayState Свойство
Другие примеры
Пример
Приостановить анимацию при наведении:
div:hover {
animation-play-state: paused;
}