Пример
Укажите, что анимация должна завершить один цикл за 3 секунды:
div {
animation-duration: 3s;
}
Попробуйте сами »
Определение и использование
CSS свойство animation-duration
определяет, сколько времени должно потребоваться анимации для завершения одного цикла.
Значение по умолчанию: | 0 |
---|---|
Унаследовано: | no |
Анимируемый: | no. Читайте о animatable |
Версия: | CSS3 |
JavaScript синтаксис: | object.style.animationDuration="3s" Попробуй |
Поддержка animation-duration
Цифры в таблице указывают первую версию браузера, которая полностью поддерживает это свойство.
Цифры, за которыми следуют -webkit-, -moz- или -o-, указывают первую версию, которая работала с префиксом.
Свойство | |||||
---|---|---|---|---|---|
animation-duration | 43.0 3.0 -webkit- |
10.0 | 16.0 5.0 -moz- |
9.0 4.0 -webkit- |
30.0 15.0 -webkit- 12.0 -o- |
Синтаксис animation-duration
animation-duration: time|initial|inherit;
Значения animation-duration
Значение | Описание | Воспроизведение |
---|---|---|
time | Указывает продолжительность времени, которое должно потребоваться анимации для завершения одного цикла. Это может быть указано в секундах или миллисекундах. Значение по умолчанию равно 0, что означает, что анимация не будет выполняться | Воспр. » |
initial | Устанавливает для этого свойства значение по умолчанию. Читайте о initial | |
inherit | Наследует это свойство от своего родительского элемента. Читайте о inherit |
Страницы по теме animation-duration
CSS Учебник: CSS Анимация
HTML DOM справочник: animationDuration свойство