- From: Yehonatan Daniv via GitHub <sysbot+gh@w3.org>
- Date: Thu, 02 Mar 2023 20:26:05 +0000
- To: public-css-archive@w3.org
If the header is stuck at `top: 0` then the way I see it is:
In the first example:
```css
#coverheader {
position: sticky;
top: 0;
animation-name: shrink;
animation-timeline: scroll();
animation-range: 0 90vh;
}
```
Will start the animation at `scrollY=0` and continue until `scrollY=90vh`.
In the second example:
```css
#coverheader {
position: sticky;
top: 0;
animation-name: shrink;
animation-timeline: view(self);
animation-range: exit 0 exit 90vh;
}
```
Regarding the range start, animation won't start running while the header is stuck, because it's still in `contain` range.
Only when it starts exiting, it starts shrinking.
As for the range end, I'm not sure we have a clear definition of what `exit 90vh` means? Is that the same as `exit 0% + 90vh`? `- 90vh`?
I think we need to resolve on #8054 to answer that.
--
GitHub Notification of comment by ydaniv
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/7575#issuecomment-1452500116 using your GitHub account
--
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config
Received on Thursday, 2 March 2023 20:26:06 UTC