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

Re: [csswg-drafts] [css-transitions] Transition to height (or width) "auto" (#626)

From: Ben Bucksch via GitHub <sysbot+gh@w3.org>
Date: Sun, 16 May 2021 17:17:07 +0000
To: public-css-archive@w3.org
Message-ID: <issue_comment.created-841847089-1621185426-sysbot+gh@w3.org>
Here's a simple attempt at a first draft (browser implementors, please feel free to adjust):
1. If an element has a CSS animation on height and its height changes to `auto`, calculate the height that the element will have with `height: auto`, and remember the value as `targetValue`.
2. Start the CSS animation from the current height value to the `targetValue`. (Implemented e.g. by using `targetValue` as temporary override for height for the purposes of the CSS animation, or similar means.)
3. If the viewport size or other page elements change, and they would cause a change of the element height in case of `auto`, set that value as the new `targetValue`, and continue the animation from the current absolute height to the new `targetValue`. In other words, add an `onresize` event listener on the element and re-run from step 1.
4. Once the CSS animation finishes, height behaves like a normal `auto`, but the size change handler from step 3 stays in place, until height is no longer set to `auto`.

"height" in the description above may be replaced with width or any similar CSS property that can have a value of `auto` and can have CSS animations.

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


-- 
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config
Received on Sunday, 16 May 2021 17:17:12 UTC

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