CSS Анимация
Определение и использование
Некоторые свойства CSS обладаютспособностью иметь анимационные эффекты, что означает, что их можно использовать для анимаций и переходов.
Анимируемые свойства могут постепенно изменяться от одного значения к другому, например размер, количество, проценты и цвета.
Поддержка браузеров
Числа в таблице указывают номер версии первого браузера, поддерживающего этот метод.
Префикс -webkit-, -moz- или -o-, указанный после числа, обозначает префикс версии браузера, которая впервые поддержала это свойство.
| 4.0 -webkit- | 10.0 | 16.0 5.0 -moz- |
4.0 -webkit- | 15.0 -webkit- 12.1 12.0 -o- |
Пример
Цвет фона постепенно меняется с красного на синий:
@keyframes mymove
{
from {background-color:red;}
to {background-color:blue;}
}
/*Safari и Chrome:*/
@-webkit-keyframes mymove
{
from {background-color:red;}
to {background-color:blue;}
}
Попробуйте сами »
Свойства анимации
Свойства анимации в CSS: