Jekyll2026-05-24T01:11:00+00:00https://rixx.github.io/baseline-updates/feed/by_tag/animation.xmlUpdates to the Baseline collection. Including RSS feeds (both for all updates and individual tags).2026-01-04T00:00:00+00:002026-01-04T00:00:00+00:00https://rixx.github.io/baseline-updates/2026/01/04/animation-compositioncaniuse · mdn · spec

The animation-composition CSS property chooses how to combine animations that affect the same property.

Source features

• css.properties.animation-composition [mdn]

]]>

2023-03-16T00:00:00+00:002023-03-16T00:00:00+00:00https://rixx.github.io/baseline-updates/2023/03/16/steps-easingcaniuse · mdn · spec

The steps() CSS easing function divides an animation or transition into equidistant intervals, jumping from value to value. The step-start and step-end keyword values are presets with a single interval.

Source features

• css.types.easing-function.steps [mdn]
• css.types.easing-function.steps.jump [mdn]

]]>

2023-03-16T00:00:00+00:002023-03-16T00:00:00+00:00https://rixx.github.io/baseline-updates/2023/03/16/web-animationscaniuse · mdn · spec

The web animation API programmatically creates, inspects, and controls element animations, to change and synchronize appearance over time.

Source features

• api.Element.animationend_event [mdn]
• api.Element.animationiteration_event [mdn]
• api.Element.animationstart_event [mdn]
• api.Element.animate [mdn]
• api.Element.animate.options_id_parameter [mdn]
• api.Animation [mdn]
• api.Animation.Animation [mdn]
• api.Animation.cancel [mdn]
• api.Animation.cancel_event [mdn]
• api.Animation.currentTime [mdn]
• api.Animation.finish [mdn]
• api.Animation.finish_event [mdn]
• api.Animation.id [mdn]
• api.Animation.pause [mdn]
• api.Animation.play [mdn]
• api.Animation.playState [mdn]
• api.Animation.playbackRate [mdn]
• api.Animation.reverse [mdn]
• api.Animation.startTime [mdn]
• api.Animation.effect [mdn]
• api.AnimationEffect [mdn]
• api.AnimationEffect.getComputedTiming [mdn]
• api.AnimationEffect.getTiming [mdn]
• api.AnimationEffect.updateTiming [mdn]
• api.KeyframeEffect [mdn]
• api.KeyframeEffect.KeyframeEffect [mdn]
• api.KeyframeEffect.target [mdn]
• api.Animation.pending [mdn]
• api.Animation.updatePlaybackRate [mdn]
• api.Animation.finished [mdn]
• api.Animation.ready [mdn]
• api.AnimationPlaybackEvent [mdn]
• api.AnimationPlaybackEvent.AnimationPlaybackEvent [mdn]
• api.AnimationPlaybackEvent.currentTime [mdn]
• api.AnimationPlaybackEvent.timelineTime [mdn]
• api.KeyframeEffect.getKeyframes [mdn]
• api.KeyframeEffect.setKeyframes [mdn]
• api.Animation.commitStyles [mdn]
• api.Animation.persist [mdn]
• api.Animation.remove_event [mdn]
• api.Animation.remove_filling_animation [mdn]
• api.Animation.replaceState [mdn]
• api.Animation.timeline [mdn]
• api.AnimationTimeline [mdn]
• api.AnimationTimeline.currentTime [mdn]
• api.Document.timeline [mdn]
• api.DocumentTimeline [mdn]
• api.DocumentTimeline.DocumentTimeline [mdn]
• api.Element.getAnimations [mdn]
• api.Document.getAnimations [mdn]
• api.Element.animate.options_pseudoElement_parameter [mdn]
• api.KeyframeEffect.pseudoElement [mdn]
• api.ShadowRoot.getAnimations [mdn]
• api.Element.animate.options_composite_parameter [mdn]
• api.KeyframeEffect.composite [mdn]
• api.Element.animate.implicit_tofrom [mdn]
• api.Element.animate.options_timeline_parameter [mdn]
• api.Element.animationcancel_event [mdn]
• api.KeyframeEffect.iterationComposite [mdn]
• api.AnimationTimeline.duration [mdn]
• api.Element.animate.options_rangeEnd_parameter [mdn]
• api.Element.animate.options_rangeStart_parameter [mdn]
• api.Element.animate.options_iterationComposite_parameter [mdn]

]]>

2022-07-15T00:00:00+00:002022-07-15T00:00:00+00:00https://rixx.github.io/baseline-updates/2022/07/15/smil-svg-animationscaniuse · mdn · spec

The <animate>, <animateMotion>, and <animateTransform> SVG elements declaratively animate SVG elements. Also known as SMIL.

Source features

• api.SVGAnimatedAngle [mdn]
• api.SVGAnimatedAngle.animVal [mdn]
• api.SVGAnimatedAngle.baseVal [mdn]
• api.SVGAnimatedEnumeration [mdn]
• api.SVGAnimatedEnumeration.animVal [mdn]
• api.SVGAnimatedEnumeration.baseVal [mdn]
• api.SVGAnimatedLength [mdn]
• api.SVGAnimatedLength.animVal [mdn]
• api.SVGAnimatedLength.baseVal [mdn]
• api.SVGAnimatedLengthList [mdn]
• api.SVGAnimatedLengthList.animVal [mdn]
• api.SVGAnimatedLengthList.baseVal [mdn]
• api.SVGAnimatedNumber [mdn]
• api.SVGAnimatedNumber.animVal [mdn]
• api.SVGAnimatedNumber.baseVal [mdn]
• api.SVGAnimatedRect [mdn]
• api.SVGPolygonElement.animatedPoints [mdn]
• api.SVGPolylineElement.animatedPoints [mdn]
• api.SVGSVGElement.pauseAnimations [mdn]
• api.SVGSVGElement.unpauseAnimations [mdn]
• api.SVGAnimatedString [mdn]
• api.SVGAnimatedString.animVal [mdn]
• api.SVGAnimatedString.baseVal [mdn]
• api.SVGAnimatedTransformList [mdn]
• api.SVGAnimatedTransformList.animVal [mdn]
• api.SVGAnimatedTransformList.baseVal [mdn]
• api.SVGAnimatedRect.animVal [mdn]
• api.SVGAnimatedRect.baseVal [mdn]
• api.SVGAnimatedPreserveAspectRatio [mdn]
• api.SVGAnimatedPreserveAspectRatio.animVal [mdn]
• api.SVGAnimatedPreserveAspectRatio.baseVal [mdn]
• api.SVGAnimatedNumberList [mdn]
• api.SVGAnimatedBoolean [mdn]
• api.SVGAnimatedInteger [mdn]
• api.SVGAnimatedBoolean.animVal [mdn]
• api.SVGAnimatedBoolean.baseVal [mdn]
• api.SVGAnimatedInteger.animVal [mdn]
• api.SVGAnimatedInteger.baseVal [mdn]
• api.SVGAnimatedNumberList.animVal [mdn]
• api.SVGAnimatedNumberList.baseVal [mdn]
• api.SVGSVGElement.animationsPaused [mdn]
• api.SVGAnimateElement [mdn]
• api.SVGAnimateTransformElement [mdn]
• api.SVGAnimationElement [mdn]
• svg.elements.animateTransform.fill [mdn]
• svg.elements.animateTransform.by [mdn]
• svg.elements.animateTransform.from [mdn]
• svg.elements.animateTransform.to [mdn]
• svg.elements.animateTransform.type [mdn]
• svg.elements.animate.fill [mdn]
• api.SVGAnimationElement.beginElement [mdn]
• api.SVGAnimationElement.beginElementAt [mdn]
• api.SVGAnimationElement.endElement [mdn]
• api.SVGAnimationElement.endElementAt [mdn]
• api.SVGAnimationElement.getCurrentTime [mdn]
• api.SVGAnimationElement.getSimpleDuration [mdn]
• api.SVGAnimationElement.getStartTime [mdn]
• api.SVGAnimationElement.targetElement [mdn]
• svg.elements.animate.attributeName [mdn]
• svg.elements.animate.attributeType [mdn]
• svg.elements.animate.dur [mdn]
• svg.elements.animate.from [mdn]
• svg.elements.animate.repeatCount [mdn]
• svg.elements.animate.to [mdn]
• api.SVGAnimationElement.requiredExtensions [mdn]
• api.SVGAnimationElement.systemLanguage [mdn]
• svg.elements.animateTransform.systemLanguage [mdn]
• svg.elements.animate.systemLanguage [mdn]
• svg.global_attributes.class.animation_support [mdn]
• api.SVGAnimateMotionElement [mdn]
• svg.elements.animateMotion.calcMode [mdn]
• svg.elements.animateMotion.fill [mdn]
• svg.elements.animateMotion.keyPoints [mdn]
• svg.elements.animateMotion.origin [mdn]
• svg.elements.animateMotion.path [mdn]
• svg.elements.animateMotion.rotate [mdn]
• svg.elements.animateMotion.systemLanguage [mdn]
• svg.elements.animateTransform [mdn]
• svg.elements.animate [mdn]
• svg.elements.animateMotion [mdn]
• svg.elements.animate.href [mdn]
• svg.elements.animateMotion.href [mdn]
• svg.elements.animateTransform.href [mdn]
• api.SVGAnimationElement.beginEvent_event [mdn]
• api.SVGAnimationElement.endEvent_event [mdn]
• api.SVGAnimationElement.repeatEvent_event [mdn]
• api.SVGAnimateColorElement [mdn]

]]>

2020-09-16T00:00:00+00:002020-09-16T00:00:00+00:00https://rixx.github.io/baseline-updates/2020/09/16/steps-easingcaniuse · mdn · spec

The steps() CSS easing function divides an animation or transition into equidistant intervals, jumping from value to value. The step-start and step-end keyword values are presets with a single interval.

Source features

• css.types.easing-function.steps [mdn]
• css.types.easing-function.steps.jump [mdn]

]]>

2020-09-16T00:00:00+00:002020-09-16T00:00:00+00:00https://rixx.github.io/baseline-updates/2020/09/16/web-animationscaniuse · mdn · spec

The web animation API programmatically creates, inspects, and controls element animations, to change and synchronize appearance over time.

Source features

• api.Element.animationend_event [mdn]
• api.Element.animationiteration_event [mdn]
• api.Element.animationstart_event [mdn]
• api.Element.animate [mdn]
• api.Element.animate.options_id_parameter [mdn]
• api.Animation [mdn]
• api.Animation.Animation [mdn]
• api.Animation.cancel [mdn]
• api.Animation.cancel_event [mdn]
• api.Animation.currentTime [mdn]
• api.Animation.finish [mdn]
• api.Animation.finish_event [mdn]
• api.Animation.id [mdn]
• api.Animation.pause [mdn]
• api.Animation.play [mdn]
• api.Animation.playState [mdn]
• api.Animation.playbackRate [mdn]
• api.Animation.reverse [mdn]
• api.Animation.startTime [mdn]
• api.Animation.effect [mdn]
• api.AnimationEffect [mdn]
• api.AnimationEffect.getComputedTiming [mdn]
• api.AnimationEffect.getTiming [mdn]
• api.AnimationEffect.updateTiming [mdn]
• api.KeyframeEffect [mdn]
• api.KeyframeEffect.KeyframeEffect [mdn]
• api.KeyframeEffect.target [mdn]
• api.Animation.pending [mdn]
• api.Animation.updatePlaybackRate [mdn]
• api.Animation.finished [mdn]
• api.Animation.ready [mdn]
• api.AnimationPlaybackEvent [mdn]
• api.AnimationPlaybackEvent.AnimationPlaybackEvent [mdn]
• api.AnimationPlaybackEvent.currentTime [mdn]
• api.AnimationPlaybackEvent.timelineTime [mdn]
• api.KeyframeEffect.getKeyframes [mdn]
• api.KeyframeEffect.setKeyframes [mdn]
• api.Animation.commitStyles [mdn]
• api.Animation.persist [mdn]
• api.Animation.remove_event [mdn]
• api.Animation.remove_filling_animation [mdn]
• api.Animation.replaceState [mdn]
• api.Animation.timeline [mdn]
• api.AnimationTimeline [mdn]
• api.AnimationTimeline.currentTime [mdn]
• api.Document.timeline [mdn]
• api.DocumentTimeline [mdn]
• api.DocumentTimeline.DocumentTimeline [mdn]
• api.Element.getAnimations [mdn]
• api.Document.getAnimations [mdn]
• api.Element.animate.options_pseudoElement_parameter [mdn]
• api.KeyframeEffect.pseudoElement [mdn]
• api.ShadowRoot.getAnimations [mdn]
• api.Element.animate.options_composite_parameter [mdn]
• api.KeyframeEffect.composite [mdn]
• api.Element.animate.implicit_tofrom [mdn]
• api.Element.animate.options_timeline_parameter [mdn]
• api.Element.animationcancel_event [mdn]
• api.KeyframeEffect.iterationComposite [mdn]
• api.AnimationTimeline.duration [mdn]
• api.Element.animate.options_rangeEnd_parameter [mdn]
• api.Element.animate.options_rangeStart_parameter [mdn]
• api.Element.animate.options_iterationComposite_parameter [mdn]

]]>

2020-01-15T00:00:00+00:002020-01-15T00:00:00+00:00https://rixx.github.io/baseline-updates/2020/01/15/smil-svg-animationscaniuse · mdn · spec

The <animate>, <animateMotion>, and <animateTransform> SVG elements declaratively animate SVG elements. Also known as SMIL.

Source features

• api.SVGAnimatedAngle [mdn]
• api.SVGAnimatedAngle.animVal [mdn]
• api.SVGAnimatedAngle.baseVal [mdn]
• api.SVGAnimatedEnumeration [mdn]
• api.SVGAnimatedEnumeration.animVal [mdn]
• api.SVGAnimatedEnumeration.baseVal [mdn]
• api.SVGAnimatedLength [mdn]
• api.SVGAnimatedLength.animVal [mdn]
• api.SVGAnimatedLength.baseVal [mdn]
• api.SVGAnimatedLengthList [mdn]
• api.SVGAnimatedLengthList.animVal [mdn]
• api.SVGAnimatedLengthList.baseVal [mdn]
• api.SVGAnimatedNumber [mdn]
• api.SVGAnimatedNumber.animVal [mdn]
• api.SVGAnimatedNumber.baseVal [mdn]
• api.SVGAnimatedRect [mdn]
• api.SVGPolygonElement.animatedPoints [mdn]
• api.SVGPolylineElement.animatedPoints [mdn]
• api.SVGSVGElement.pauseAnimations [mdn]
• api.SVGSVGElement.unpauseAnimations [mdn]
• api.SVGAnimatedString [mdn]
• api.SVGAnimatedString.animVal [mdn]
• api.SVGAnimatedString.baseVal [mdn]
• api.SVGAnimatedTransformList [mdn]
• api.SVGAnimatedTransformList.animVal [mdn]
• api.SVGAnimatedTransformList.baseVal [mdn]
• api.SVGAnimatedRect.animVal [mdn]
• api.SVGAnimatedRect.baseVal [mdn]
• api.SVGAnimatedPreserveAspectRatio [mdn]
• api.SVGAnimatedPreserveAspectRatio.animVal [mdn]
• api.SVGAnimatedPreserveAspectRatio.baseVal [mdn]
• api.SVGAnimatedNumberList [mdn]
• api.SVGAnimatedBoolean [mdn]
• api.SVGAnimatedInteger [mdn]
• api.SVGAnimatedBoolean.animVal [mdn]
• api.SVGAnimatedBoolean.baseVal [mdn]
• api.SVGAnimatedInteger.animVal [mdn]
• api.SVGAnimatedInteger.baseVal [mdn]
• api.SVGAnimatedNumberList.animVal [mdn]
• api.SVGAnimatedNumberList.baseVal [mdn]
• api.SVGSVGElement.animationsPaused [mdn]
• api.SVGAnimateElement [mdn]
• api.SVGAnimateTransformElement [mdn]
• api.SVGAnimationElement [mdn]
• svg.elements.animateTransform.fill [mdn]
• svg.elements.animateTransform.by [mdn]
• svg.elements.animateTransform.from [mdn]
• svg.elements.animateTransform.to [mdn]
• svg.elements.animateTransform.type [mdn]
• svg.elements.animate.fill [mdn]
• api.SVGAnimationElement.beginElement [mdn]
• api.SVGAnimationElement.beginElementAt [mdn]
• api.SVGAnimationElement.endElement [mdn]
• api.SVGAnimationElement.endElementAt [mdn]
• api.SVGAnimationElement.getCurrentTime [mdn]
• api.SVGAnimationElement.getSimpleDuration [mdn]
• api.SVGAnimationElement.getStartTime [mdn]
• api.SVGAnimationElement.targetElement [mdn]
• svg.elements.animate.attributeName [mdn]
• svg.elements.animate.attributeType [mdn]
• svg.elements.animate.dur [mdn]
• svg.elements.animate.from [mdn]
• svg.elements.animate.repeatCount [mdn]
• svg.elements.animate.to [mdn]
• api.SVGAnimationElement.requiredExtensions [mdn]
• api.SVGAnimationElement.systemLanguage [mdn]
• svg.elements.animateTransform.systemLanguage [mdn]
• svg.elements.animate.systemLanguage [mdn]
• svg.global_attributes.class.animation_support [mdn]
• api.SVGAnimateMotionElement [mdn]
• svg.elements.animateMotion.calcMode [mdn]
• svg.elements.animateMotion.fill [mdn]
• svg.elements.animateMotion.keyPoints [mdn]
• svg.elements.animateMotion.origin [mdn]
• svg.elements.animateMotion.path [mdn]
• svg.elements.animateMotion.rotate [mdn]
• svg.elements.animateMotion.systemLanguage [mdn]
• svg.elements.animateTransform [mdn]
• svg.elements.animate [mdn]
• svg.elements.animateMotion [mdn]
• svg.elements.animate.href [mdn]
• svg.elements.animateMotion.href [mdn]
• svg.elements.animateTransform.href [mdn]
• api.SVGAnimationElement.beginEvent_event [mdn]
• api.SVGAnimationElement.endEvent_event [mdn]
• api.SVGAnimationElement.repeatEvent_event [mdn]
• api.SVGAnimateColorElement [mdn]

]]>

2018-03-30T00:00:00+00:002018-03-30T00:00:00+00:00https://rixx.github.io/baseline-updates/2018/03/30/animations-csscaniuse · mdn · spec

The animation CSS property animates an element’s style over time, using keyframes described in @keyframes rules.

Source features

• api.AnimationEvent [mdn]
• api.AnimationEvent.animationName [mdn]
• api.AnimationEvent.elapsedTime [mdn]
• css.at-rules.keyframes [mdn]
• css.properties.animation [mdn]
• css.properties.animation-delay [mdn]
• css.properties.animation-direction [mdn]
• css.properties.animation-direction.alternate [mdn]
• css.properties.animation-direction.alternate-reverse [mdn]
• css.properties.animation-direction.normal [mdn]
• css.properties.animation-direction.reverse [mdn]
• css.properties.animation-duration [mdn]
• css.properties.animation-fill-mode [mdn]
• css.properties.animation-fill-mode.backwards [mdn]
• css.properties.animation-fill-mode.both [mdn]
• css.properties.animation-fill-mode.forwards [mdn]
• css.properties.animation-fill-mode.none [mdn]
• css.properties.animation-iteration-count [mdn]
• css.properties.animation-iteration-count.infinite [mdn]
• css.properties.animation-name [mdn]
• css.properties.animation-name.none [mdn]
• css.properties.animation-play-state [mdn]
• css.properties.animation-play-state.paused [mdn]
• css.properties.animation-play-state.running [mdn]
• css.properties.animation-timing-function [mdn]
• api.CSSKeyframeRule [mdn]
• api.CSSKeyframeRule.keyText [mdn]
• api.CSSKeyframeRule.style [mdn]
• api.CSSKeyframesRule [mdn]
• api.CSSKeyframesRule.cssRules [mdn]
• api.CSSKeyframesRule.deleteRule [mdn]
• api.CSSKeyframesRule.findRule [mdn]
• api.CSSKeyframesRule.name [mdn]
• api.CSSKeyframesRule.appendRule [mdn]
• api.AnimationEvent.AnimationEvent [mdn]
• api.AnimationEvent.pseudoElement [mdn]
• api.CSSAnimation [mdn]
• api.CSSAnimation.animationName [mdn]
• css.properties.animation-timing-function.jump [mdn]
• api.CSSKeyframesRule.length [mdn]
• css.properties.animation-duration.auto [mdn]

]]>

2018-01-29T00:00:00+00:002018-01-29T00:00:00+00:00https://rixx.github.io/baseline-updates/2018/01/29/cubic-bezier-easingcaniuse · mdn · spec

The cubic-bezier() CSS easing function interpolates along a smooth curve, creating animations and transitions with continuous changes in speed. The ease, ease-in, ease-out, and ease-in-out keyword values are presets for common Bézier curves.

Source features

• css.types.easing-function.cubic-bezier [mdn]

]]>

2015-09-30T00:00:00+00:002015-09-30T00:00:00+00:00https://rixx.github.io/baseline-updates/2015/09/30/animations-csscaniuse · mdn · spec

The animation CSS property animates an element’s style over time, using keyframes described in @keyframes rules.

Source features

• api.AnimationEvent [mdn]
• api.AnimationEvent.animationName [mdn]
• api.AnimationEvent.elapsedTime [mdn]
• css.at-rules.keyframes [mdn]
• css.properties.animation [mdn]
• css.properties.animation-delay [mdn]
• css.properties.animation-direction [mdn]
• css.properties.animation-direction.alternate [mdn]
• css.properties.animation-direction.alternate-reverse [mdn]
• css.properties.animation-direction.normal [mdn]
• css.properties.animation-direction.reverse [mdn]
• css.properties.animation-duration [mdn]
• css.properties.animation-fill-mode [mdn]
• css.properties.animation-fill-mode.backwards [mdn]
• css.properties.animation-fill-mode.both [mdn]
• css.properties.animation-fill-mode.forwards [mdn]
• css.properties.animation-fill-mode.none [mdn]
• css.properties.animation-iteration-count [mdn]
• css.properties.animation-iteration-count.infinite [mdn]
• css.properties.animation-name [mdn]
• css.properties.animation-name.none [mdn]
• css.properties.animation-play-state [mdn]
• css.properties.animation-play-state.paused [mdn]
• css.properties.animation-play-state.running [mdn]
• css.properties.animation-timing-function [mdn]
• api.CSSKeyframeRule [mdn]
• api.CSSKeyframeRule.keyText [mdn]
• api.CSSKeyframeRule.style [mdn]
• api.CSSKeyframesRule [mdn]
• api.CSSKeyframesRule.cssRules [mdn]
• api.CSSKeyframesRule.deleteRule [mdn]
• api.CSSKeyframesRule.findRule [mdn]
• api.CSSKeyframesRule.name [mdn]
• api.CSSKeyframesRule.appendRule [mdn]
• api.AnimationEvent.AnimationEvent [mdn]
• api.AnimationEvent.pseudoElement [mdn]
• api.CSSAnimation [mdn]
• api.CSSAnimation.animationName [mdn]
• css.properties.animation-timing-function.jump [mdn]
• api.CSSKeyframesRule.length [mdn]
• css.properties.animation-duration.auto [mdn]

]]>

2015-07-29T00:00:00+00:002015-07-29T00:00:00+00:00https://rixx.github.io/baseline-updates/2015/07/29/cubic-bezier-easingcaniuse · mdn · spec

The cubic-bezier() CSS easing function interpolates along a smooth curve, creating animations and transitions with continuous changes in speed. The ease, ease-in, ease-out, and ease-in-out keyword values are presets for common Bézier curves.

Source features

• css.types.easing-function.cubic-bezier [mdn]

]]>