W3C home > Mailing lists > Public > public-css-archive@w3.org > July 2021

Re: [csswg-drafts] [css-variables] When does substitution occur, before or after animation interopolation? (#411)

From: Tab Atkins Jr. via GitHub <sysbot+gh@w3.org>
Date: Thu, 29 Jul 2021 21:57:20 +0000
To: public-css-archive@w3.org
Message-ID: <issue_comment.created-889486992-1627595838-sysbot+gh@w3.org>
Okay so I've been researching this to finally get a proper answer down in the spec, and the answer seems, uh, complicated.

Firefox, as far as I can tell, takes an easy route: custom properties defined directly on the element are visible to animations (can be used as var() inside of @keyframes), but custom properties defined in @keyframes aren't visible to properties directly on the element. (They *are* visible to other rules in the *same keyframe*, but not cross-keyframe.)

Chrome does something more complicated that I'm still puzzling out.  It has all of Firefox's cross-context behavior, plus custom properties defined in @keyframes *are* visible to the element itself. They appear to be visible cross-animations, too; that is, a custom property animated by one @keyframes can be used by a different @keyframes.  Exactly how it determines which properties are visible to what, when, looks complex; I think animation order matters; keyframe temporal ordering *might* matter, but I haven't gotten a testcase together to demonstrate it for sure yet.

So I'm gonna do some more exploratory work on this and possibly bug Chrome/WK implementors about details before I commit to something to bring to the group.

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

Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config
Received on Thursday, 29 July 2021 21:57:22 UTC

This archive was generated by hypermail 2.4.0 : Tuesday, 5 July 2022 06:42:39 UTC