animation

Оновлено: 25.05.2022

animation

Універсальна властивість, що задає одразу декілька параметрів анімації.

Коротка інформація

Значення за замовчуванням
  • animation-name: none
  • animation-duration: 0s
  • animation-timing-function: ease
  • animation-delay: 0s
  • animation-iteration-count: 1
  • animation-direction: normal
  • animation-fill-mode: none
  • animation-play-state: running
НаслідуєтьсяНі
ЗастосовуєтьсяДо всіх елементів, до псевдоелементів ::before и ::after
АнімуєтьсяНі

Синтаксис

animation: animation-duration || animation-timing-function || animation-delay || animation-iteration-count || animation-direction || animation-fill-mode || animation-play-state || [none | animation-name]

Значення

Будь-які комбінації значень, що розділяються між собою пробілом, визначають параметри анімації.

Приклад

Об'єктна модель

Об'єкт.style.animation

Примітка

Chrome, Safari та Android підтримують властивість -webkit-animation.

Opera до версії 12.10 підтримують властивість -o-animation.

Firefox до версії 16 підтримують властивість -moz-animation.

Браузери

animation

Переглянути сумісність з Can I use?

animation