Re: [csswg-drafts] [css-view-transitions-2] Ignore offscreen elements from participating in transitions (#8282)

Sorry to backtrack, but I think there is a problem we haven't considered with this, unrelated to the optimization options.

Everything is fine when the viewport stays where it is, but if we implement this suggestion it might produce undesired results when scrolling (or otherwise changing anything about the viewport).

Imagine the following scenario:
- An element flies into the top of the viewport.
- We don't want this animation to occur if the element is out of the viewport, so we mark it as `offscreen: hide` or whatever.
- The user scroll down during the animation
- The parent of the element also has a `view-transition-name` (it could be the root)

There are 3 options here:
1. If we don't capture that element at all, it would potentially appear double! as part of capturing the old root, and as the new element
2. If we don't capture the element, but also ignore it in the parent, the element would disappear immediately when scrolling, and the new element would re-appear
3. we can capture both states, but add a hint that lets the author use a specific animation when flying from out-of-viewport. This way, the author can decide, for example, to fade out the old element and fade in the new one.

(2) is perhaps OK but feels less flexible. We can achieve (3) in a "soft" way, by using UA view-transition-classes, e.g.:

```css
::view-transition-group(header.-ua-from-out-of-viewport) {
  animation: fade-in-instead-of-fly;
}
```








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


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

Received on Wednesday, 24 April 2024 09:12:26 UTC