Animation Class
An animation: plays an animation effect on a timeline (https://drafts.csswg.org/web-animations-1/#animations).
public class Animation : EventTargetRemarks
The pending play and pause tasks run when the event loop updates the rendering (the animation is then ready), and the finish, cancel and remove events are dispatched there (https://drafts.csswg.org/web-animations-1/#update-animations-and-send-events). An animation without timeline, or whose timeline is inactive (e.g. its document has no browsing context), stays pending.
See also
- Inheritance
EventTargetAnimation
Constructors
| Name | Description |
|---|---|
| Animation(AnimationEffect?) | Creates an animation of the effect on the timeline (https://drafts.csswg.org/web-animations-1/#dom-animation-animation): the default timeline of the document of the current global object. |
| Animation(AnimationEffect?, AnimationTimeline?) | Creates an animation of the effect on the timeline (null for no timeline). |
Animation overloads
Animation(AnimationEffect?)
Animation.csCreates an animation of the effect on the timeline (https://drafts.csswg.org/web-animations-1/#dom-animation-animation): the default timeline of the document of the current global object.
public Animation(AnimationEffect? effect = null)Animation(AnimationEffect?, AnimationTimeline?)
Animation.csCreates an animation of the effect on the timeline (null for no timeline).
public Animation(AnimationEffect? effect, AnimationTimeline? timeline)Properties
| Name | Description |
|---|---|
| CurrentTime | Gets or sets the current time of the animation, in milliseconds (https://drafts.csswg.org/web-animations-1/#dom-animation-currenttime). |
| Effect | Gets or sets the effect of the animation (https://drafts.csswg.org/web-animations-1/#dom-animation-effect). |
| Finished | Gets the promise resolved when the animation finishes (https://drafts.csswg.org/web-animations-1/#dom-animation-finished). |
| Id | Gets or sets the identifier of the animation. |
| OnCancel | Gets or sets the event handler of the cancel event. |
| OnFinish | Gets or sets the event handler of the finish event. |
| OnRemove | Gets or sets the event handler of the remove event. |
| OverallProgress | Gets the overall progress of the animation, from 0 to 1 (https://drafts.csswg.org/web-animations-2/#dom-animation-overallprogress). |
| Pending | Gets whether the animation has a pending play or pause task (https://drafts.csswg.org/web-animations-1/#dom-animation-pending). |
| PlayState | Gets the play state of the animation (https://drafts.csswg.org/web-animations-1/#dom-animation-playstate). |
| PlaybackRate | Gets or sets the playback rate (https://drafts.csswg.org/web-animations-1/#dom-animation-playbackrate). |
| RangeEnd | Gets or sets the end of the animation attachment range (https://drafts.csswg.org/web-animations-2/#dom-animation-rangeend): "normal" or a TimelineRangeOffset. A string is parsed as an animation-range-end value. |
| RangeStart | Gets or sets the start of the animation attachment range (https://drafts.csswg.org/web-animations-2/#dom-animation-rangestart): "normal" or a TimelineRangeOffset. A string is parsed as an animation-range-start value. |
| Ready | Gets the promise resolved when the animation is ready to play (https://drafts.csswg.org/web-animations-1/#dom-animation-ready). |
| ReplaceState | Gets the replace state of the animation (https://drafts.csswg.org/web-animations-1/#dom-animation-replacestate). |
| StartTime | Gets or sets the start time of the animation, in milliseconds (https://drafts.csswg.org/web-animations-1/#dom-animation-starttime). |
| Timeline | Gets or sets the timeline of the animation (https://drafts.csswg.org/web-animations-1/#dom-animation-timeline). |
CurrentTime
Animation.csGets or sets the current time of the animation, in milliseconds (https://drafts.csswg.org/web-animations-1/#dom-animation-currenttime).
public CssNumberish? CurrentTime { get; set; }Property value
See also
Effect
Animation.csGets or sets the effect of the animation (https://drafts.csswg.org/web-animations-1/#dom-animation-effect).
public AnimationEffect? Effect { get; set; }Property value
See also
Finished
Animation.csGets the promise resolved when the animation finishes (https://drafts.csswg.org/web-animations-1/#dom-animation-finished).
Property value
See also
Gets or sets the identifier of the animation.
public string Id { get; set; }OnCancel
Animation.csGets or sets the event handler of the cancel event.
Property value
See also
OnFinish
Animation.csGets or sets the event handler of the finish event.
Property value
See also
OnRemove
Animation.csGets or sets the event handler of the remove event.
Property value
See also
OverallProgress
Animation.csGets the overall progress of the animation, from 0 to 1 (https://drafts.csswg.org/web-animations-2/#dom-animation-overallprogress).
public double? OverallProgress { get; }Property value
See also
Pending
Animation.csGets whether the animation has a pending play or pause task (https://drafts.csswg.org/web-animations-1/#dom-animation-pending).
public bool Pending { get; }PlayState
Animation.csGets the play state of the animation (https://drafts.csswg.org/web-animations-1/#dom-animation-playstate).
public AnimationPlayState PlayState { get; }Property value
See also
PlaybackRate
Animation.csGets or sets the playback rate (https://drafts.csswg.org/web-animations-1/#dom-animation-playbackrate).
public double PlaybackRate { get; set; }RangeEnd
Animation.csGets or sets the end of the animation attachment range (https://drafts.csswg.org/web-animations-2/#dom-animation-rangeend): "normal" or a TimelineRangeOffset. A string is parsed as an animation-range-end value.
public TimelineRangeValue RangeEnd { get; set; }RangeStart
Animation.csGets or sets the start of the animation attachment range (https://drafts.csswg.org/web-animations-2/#dom-animation-rangestart): "normal" or a TimelineRangeOffset. A string is parsed as an animation-range-start value.
public TimelineRangeValue RangeStart { get; set; }Ready
Animation.csGets the promise resolved when the animation is ready to play (https://drafts.csswg.org/web-animations-1/#dom-animation-ready).
ReplaceState
Animation.csGets the replace state of the animation (https://drafts.csswg.org/web-animations-1/#dom-animation-replacestate).
public AnimationReplaceState ReplaceState { get; }StartTime
Animation.csGets or sets the start time of the animation, in milliseconds (https://drafts.csswg.org/web-animations-1/#dom-animation-starttime).
public CssNumberish? StartTime { get; set; }Property value
See also
Timeline
Animation.csGets or sets the timeline of the animation (https://drafts.csswg.org/web-animations-1/#dom-animation-timeline).
public AnimationTimeline? Timeline { get; set; }Property value
See also
Methods
| Name | Description |
|---|---|
| Cancel() | Cancels the animation (https://drafts.csswg.org/web-animations-1/#dom-animation-cancel). |
| CommitStyles() | Writes the current values of the effect of the animation (and of the animations below it in the composite order) to the style attribute of its target (https://drafts.csswg.org/web-animations-1/#dom-animation-commitstyles). |
| Finish() | Seeks the animation to the end of its effect (https://drafts.csswg.org/web-animations-1/#dom-animation-finish). |
| Pause() | Pauses the animation (https://drafts.csswg.org/web-animations-1/#dom-animation-pause). |
| Persist() | Prevents the animation from being removed when it is replaced (https://drafts.csswg.org/web-animations-1/#dom-animation-persist). |
| Play() | Plays or resumes the animation (https://drafts.csswg.org/web-animations-1/#dom-animation-play). |
| Reverse() | Reverses the playback direction of the animation (https://drafts.csswg.org/web-animations-1/#dom-animation-reverse). |
| UpdatePlaybackRate(double) | Sets the playback rate without a jump of the current time, once the animation is ready (https://drafts.csswg.org/web-animations-1/#dom-animation-updateplaybackrate). |
Cancel()
Animation.csCancels the animation (https://drafts.csswg.org/web-animations-1/#dom-animation-cancel).
public void Cancel()CommitStyles()
Animation.CommitStyles.csWrites the current values of the effect of the animation (and of the animations below it in the composite order) to the style attribute of its target (https://drafts.csswg.org/web-animations-1/#dom-animation-commitstyles).
public void CommitStyles()Exceptions
DomException- The target is a pseudo-element or an element without
styleattribute (NoModificationAllowedError), or it is not being rendered (InvalidStateError).
See also
Finish()
Animation.csSeeks the animation to the end of its effect (https://drafts.csswg.org/web-animations-1/#dom-animation-finish).
public void Finish()Exceptions
DomException- The playback rate is 0, or the effect is infinite and the playback rate is positive (InvalidStateError).
See also
Pause()
Animation.csPauses the animation (https://drafts.csswg.org/web-animations-1/#dom-animation-pause).
public void Pause()Exceptions
DomException- The current time is unresolved, the animation plays backwards and its effect is infinite (InvalidStateError).
See also
Persist()
Animation.csPrevents the animation from being removed when it is replaced (https://drafts.csswg.org/web-animations-1/#dom-animation-persist).
public void Persist()Play()
Animation.csPlays or resumes the animation (https://drafts.csswg.org/web-animations-1/#dom-animation-play).
public void Play()Exceptions
DomException- The animation plays backwards and its effect is infinite (InvalidStateError).
See also
Reverse()
Animation.csReverses the playback direction of the animation (https://drafts.csswg.org/web-animations-1/#dom-animation-reverse).
public void Reverse()Exceptions
DomException- The animation has no active timeline, or its effect is infinite (InvalidStateError).
See also
UpdatePlaybackRate(double)
Animation.csSets the playback rate without a jump of the current time, once the animation is ready (https://drafts.csswg.org/web-animations-1/#dom-animation-updateplaybackrate).