Re: [csswg-drafts] How to animate discrete elements using WAAPI? (#11537)

Hi @bramus .

Thanks for the answer. What I've been trying to animate is a dialog. Here is what I'm trying to replicate using WAAPI: https://codepen.io/bakura10/pen/GgKYKZE

Here is the best I've been able to reproduce in JS (you must make sure to use Chrome 132+ as it relies on toggle event): https://codepen.io/bakura10/pen/jENeNre

Notice how the backdrop does not animate on exit. It seems the problem is that I can't specify the `overlay` as part of the WAAPI, which is the major difference between the CSS and JS one. I've tried to add `overlay` to the WAAPI to try to transition between auto and none, but this does not seem to work.

The reason I need WAAPI instead of CSS here is that we have animations that need to be coordinated (we need to animate the dialog itself, then each part of the content of the dialog with staggering, which is hardly feasible in CSS with dynamic content).

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


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

Received on Wednesday, 22 January 2025 01:30:55 UTC