Style animationName Property

Definition and Usage

animationName Sets or returns the name of the @keyframes animation to be bound to the selector.

Example

Change the animationName property of the <div> element:

document.getElementById("myDIV").style.animationName = "myNEWmove";

Try It Yourself

Syntax

Return the animationName property:

object.style.animationName

Set the animationName property:

object.style.animationName = "none|keyframename|initial|inherit"

Attribute Value

Value Description
none Default Value. Specifies no animation (can be used to override animations from the cascade).
keyframename Specifies the name of the keyframes to be bound to the selector.
initial Sets this property to its default value. See initial.
inherit Inherits this property from its parent element. See inherit.

Technical Details

Default Value: none
Return Value: A string representing the element's animation-name Property.
CSS Version: CSS3

Browser Support

animationName is a CSS3 (1999) feature.

All browsers fully support it:

Chrome Edge Firefox Safari Opera IE
Chrome Edge Firefox Safari Opera IE
Supported Supported Supported Supported Supported 11

Related Pages

CSS Reference Manual:animation-name Property