animation-nameプロパティ
animation-nameプロパティは、CSSアニメーションをエレメントに反映するのためのプロパティです。@keyframesセレクターで定義したCSSアニメーションを、animation-nameプロパティでそれを指定します。
@keyframes example_anime {
from {
...
}
to {
...
}
}
...
div:hover{
animation-name: example_anime;
animation-duration: 1s;
animation-fill-mode: forwards;
...
}
...
構文(Syntax)
CSS
animation-name:[ none | name | initial | inherit ];
DOM(JavaScript)
値の取得
object.style.animationName
値の設定
object.style.animationName = "[ none | name | initial | inherit ]"
Values
| Value | 摘要 |
|---|
| none | 初期値（default値） |
| name | @keyframesで定義した名称（keyframename） |
| initial | 初期値に戻す |
| inherit | 親エレメントのプロパティを継承 |
備考（Remarks）
| |
|---|
| 初期値（Default value） | none |
| 継承（Inherited） | no |
| 変化（Animatable） | no |
Example
