animation-name

Experimental

Это экспериментальная технология
Так как спецификация этой технологии ещё не стабилизировалась, смотрите таблицу совместимости по поводу использования в различных браузерах. Также заметьте, что синтаксис и поведение экспериментальной технологии может измениться в будущих версиях браузеров, вслед за изменениями спецификации.

Описание

CSS свойство animation-name задаёт список анимаций, чтобы применить к элементу. Каждое имя является правилом @keyframes (en-US), которое задаёт значения свойств для последовательности анимации.

Часто удобно использовать сокращённое свойство animation для одновременной установки всех свойств анимации.

Синтаксис

/* Single animation */
animation-name: none;
animation-name: test_05;
animation-name: -specific;
animation-name: sliding-vertically;

/* Multiple animations */
animation-name: test1;
animation-name: test1, animation4;
animation-name: none, -moz-specific, sliding;

/* Global values */
animation-name: initial
animation-name: inherit
animation-name: unset

Значения

none
Это специальное ключевое слово, обозначающее отсутствие ключевых кадров. Оно может быть использовано для отключения анимации без изменения порядка других идентификаторов, или для отключения анимации, поступающей из каскада.
<custom-ident>
Строка, идентифицирующая анимацию. Этот идентификатор состоит из комбинации букв без учёта регистра от a до z, цифр от 0 до 9, подчёркивания (_), и/или черты (-). Первый символ без черты должен быть буквой (то есть, без цифры в начале, даже если перед ним стоит черта.) Кроме того, две черты запрещены в начале идентификатора. Оно не может быть none, unset, initial, или inherit в любой комбинации случаев.

Формальный синтаксис

[ (en-US) none | (en-US) <keyframes-name> ] (en-US)# (en-US)

где
<keyframes-name> = <custom-ident> | (en-US) <string> (en-US)

Примеры

См. CSS animations.

Спецификации

Спецификация Статус Комментарий
CSS Animations Level 1
Определение 'animation-name' в этой спецификации.
Рабочий черновик Начальное определение

Совместимость с браузерами

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help! (en-US)
Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Basic support (Да)-webkit (en-US)
43.0
5.0 (5.0)-moz (en-US)
16.0 (16.0)
10  12 -o (en-US)
12.10
4.0-webkit (en-US)
Feature Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile Chrome for Android
Basic support ? ? ? ? ? ?

Смотрите также