Re: [csswg-drafts] [css-animations] Proposal: Add a way to make the animation timing function apply to the whole animation (#8881)

Yes, in Web Animations both types of easing can apply at once.

There is no particular section that says how they combine, but rather it falls out of the calculations in the model (i.e. the effect/iteration easing is used to calculate the [iteration progress](https://drafts.csswg.org/web-animations-1/#the-iteration-progress), and then that is used in [calculating the value of a keyframe effect](https://drafts.csswg.org/web-animations-1/#the-effect-value-of-a-keyframe-animation-effect) where any keyframe easing is used to calculate the _transformed distance_).

There is a little non-normative explanation of the difference in this section: https://drafts.csswg.org/web-animations-1/#processing-a-keyframes-argument

I believe there are also several web platform tests covering this behavior.

(This is also the reason Web Animations' `easing` property defaults to `"linear"` as opposed to `"ease"` like in CSS Transitions. By defaulting to `"linear"` the author can choose where they want to apply easing—to the effect or to the keyframes or to both—without having to reset any default easing.)

-- 
GitHub Notification of comment by birtles
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/8881#issuecomment-1567737316 using your GitHub account


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config

Received on Tuesday, 30 May 2023 04:23:52 UTC