Animation: integrating animations into web applications
shadow
Element Animation offers animation integration into web applications, making it easy to create engaging user interfaces. It provides customisation options in the form of delay, duration or, for example, the number of animation repeats.
| Description | Property specifying the delay before the animation starts in milliseconds. |
| Attribute | delay |
| Type | number |
| Default | 0 |
| Description | Animation direction property |
| Attribute | direction |
| Type | "normal" ｜ "reverse" ｜ "alternate" ｜ "alternate-reverse" |
| Default | normal |
| Description | A property indicating the duration of the animation in milliseconds. |
| Attribute | duration |
| Type | number |
| Default | 1000 |
| Description | Property specifying the release function for the animation. |
| Attribute | toggle-icon |
| Type | "ease." ｜ "ease-in" ｜ "ease-out" ｜ "ease-in-out" ｜ "linear" ｜ "step-start" ｜ "step-end" |
| Default | linear |
| Description | A property specifying the delay after the animation has finished, in milliseconds. |
| Attribute | endDelay |
| Type | number |
| Default | '0' |
| Description | Property defining the animation fill mode (before and after animation). |
| Attribute | fill |
| Type | "car" ｜ "none" ｜ "forwards" ｜ "backwards" ｜ "both" |
| Default | car |
| Description | A property defining the name of the animation to be used. For a list of all available animations, see animate.css. |
| Attribute | name |
| Type | "car" ｜ "none" ｜ "forwards" ｜ "backwards" ｜ "both" |
| Default | car |
No events available for this component.
No public methods available for this component.
No CSS shadow parts available for this component.
No CSS custom properties available for this component.
No slots available for this component.