Scroll-Driven Animations

[ydaniv]

Description

From the spec:

Defines CSS properties and an API for creating animations that are tied to the scroll offset of a scroll container.

I think the Animation.progress endpoint is still missing in Chrome as well, and it is still not published in last draft.

Specification

https://www.w3.org/TR/scroll-animations-1/

Additional Signals

Standards Positions

Implemented in Blink and WIP in WebKit and Gecko.

Tests

https://wpt.fyi/results/?label=master&label=experimental&aligned&q=scroll-animations

Browser Bugs

WebKit:
https://bugs.webkit.org/show_bug.cgi?id=222295 (Meta)

Gecko:
https://bugzilla.mozilla.org/show_bug.cgi?id=1676779 (Meta)

Blink:
https://issues.chromium.org/issues/40914396 (Progress API)
https://issues.chromium.org/issues/359904330 (Using Custom Properties inside Animation Ranges)

[BearCooder]

Also thread from last year proposal from @ramiy
#439

[egirard]

Blink issue for Scroll-Driven Animations is https://issues.chromium.org/issues/40050657
Your link is to the Progress API, which probably falls outside of your proposal?

[ydaniv]

Yes, but that one is already fixed.
The point of the link I put is stated above, though I assume more open issues could be dug out and added to the list.

[ydaniv]

Edit: Added another Blink open issue.

[wpt-interop]

Thank you for proposing Scroll-Driven Animations for inclusion in Interop 2025.

We wanted to let you know that this proposal was not selected to be part of Interop this year.

On behalf of the entire Interop team, thank you for submitting this proposal for consideration. We got many more proposals than we could include in this year's project, necessitating some difficult choices. Please note this should not be taken as a comment on the technology as a whole, or our willingness to consider it for Interop in the future. We appreciate the work you put into your proposal, and would welcome your participation in future rounds of Interop.

For an overview of our process, see proposal selection. Thank you again for contributing to Interop 2025.

Posted on behalf of the Interop team.