Contact emails [email protected]
Explainer https://github.com/explainers-by-googlers/scroll-triggered-animations Specification https://drafts.csswg.org/css-animations-2/#timeline-triggers Design docs https://github.com/explainers-by-googlers/scroll-triggered-animations/blob/main/README.md Summary This feature adds scroll-position-based control of animations, eg playing, pausing, and resetting an animation. A common pattern on pages across the web is to kick off an animation when a scroll position is reached. Developers often do this by using JavaScript to manually detect that an element is within its scroll container's viewport and to kick off a corresponding animation (eg perhaps sliding that element into view). Many of such use cases are based on information that can be provided declaratively. This feature gives authors the ability to create such interactions declaratively via CSS, allowing the user agent to offload the handling of this interaction to a worker thread. The API also includes JavaScript interfaces that allow the feature to be extended to web animations in addition to CSS animations. Blink component Blink>CSS Web Feature ID Missing feature Motivation Kicking off animations after having reached a desired scroll position is a common pattern on the web. Achieving this requires JavaScript to know when to trigger an animation. However, in many cases, all the information needed for many use cases can be declaratively specified. This feature provides authors a robust, reliable, performant and convenient way to set up such animations in response to scrolling. Initial public proposal https://github.com/w3c/csswg-drafts/issues/8942 TAG review https://github.com/w3ctag/design-reviews/issues/1167 TAG review status Pending Risks Interoperability and Compatibility No information provided Gecko: No signal (https://github.com/mozilla/standards-positions/issues/1315) WebKit: No signal (https://github.com/WebKit/standards-positions/issues/576) Web developers: No signals Other signals: WebView application risks Does this intent deprecate or change behavior of existing APIs, such that it has potentially high risk for Android WebView-based applications? No information provided Debuggability No information provided Will this feature be supported on all six Blink platforms (Windows, Mac, Linux, ChromeOS, Android, and Android WebView)? Yes Is this feature fully tested by web-platform-tests? Yes https://wpt.fyi/results/?label=master&label=experimental&aligned&q=scroll-animations%2Fanimation-trigger DevTrial instructions https://github.com/explainers-by-googlers/scroll-triggered-animations/blob/main/DEV_TRIALS.md Flag name on about://flags No information provided Finch feature name No information provided Non-finch justification No information provided Rollout plan Will ship enabled for all users Requires code in //chrome? False Tracking bug https://crbug.com/390314945 Availability expectation Feature is expected to become available on WebPlatform Baseline. Adoption expectation We expect the feature to meet the needs of many scroll related animation use cases on the web. Adoption plan We plan to work with interested developers (of which we have at least 2 at the moment). We also plan to have a blog post. Estimated milestones Shipping on desktop 144 DevTrial on desktop 144 Shipping on Android 144 DevTrial on Android 144 Shipping on WebView 144 Anticipated spec changes Open questions about a feature may be a source of future web compat or interop issues. Please list open issues (eg links to known github issues in the project for the feature specification) whose resolution may introduce web compat/interop risk (eg, changing to naming or structure of the API in a non-backward-compatible way). This feature is also intended to be supported via the web animations API but only the CSS animations spec is up to date. We expect the Web Animations spec to be closely related to the CSS spec/syntax and plan to update the Web Animations spec after addressing any feedback that arises from the CSS spec. We filed CSS working group issue https://github.com/w3c/csswg-drafts/issues/13010 for feedback on the CSS spec. Link to entry on the Chrome Platform Status https://chromestatus.com/feature/5181996801982464?gate=5104214340272128 Links to previous Intent discussions Intent to Prototype: https://groups.google.com/a/chromium.org/d/msgid/blink-dev/CAA6pwF6yEmATfHMv4RCp%2B6F_ufem%2Bt3%3D4maF15ySCKGXfCxb3w%40mail.gmail.com Ready for Trial: https://groups.google.com/a/chromium.org/g/blink-dev/c/Gw42-BxHqcs/m/baT_KRxkAgAJ This intent message was generated by Chrome Platform Status. -- You received this message because you are subscribed to the Google Groups "blink-dev" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To view this discussion visit https://groups.google.com/a/chromium.org/d/msgid/blink-dev/691cd55b.050a0220.2a427a.011a.GAE%40google.com.
