- From: Bramus! via GitHub <sysbot+gh@w3.org>
- Date: Tue, 21 Feb 2023 14:41:23 +0000
- To: public-css-archive@w3.org
This seems like a good candidate for state queries, @mirisuzanne.
```css
.sticky-header {
position: sticky;
top: 0;
transform: translateY(0%);
transition: transform 0.5s ease-in-out;
transition-delay: 0.25s;
}
/* Move sticky header out of view when scrolling the page down */
@container body state(scrolling and scroll-direction: block-start) {
.sticky-header {
transform: translateY(-100%);
}
}
```
_(* insert potential confusion about scroll-direction here … does it mean the scroller is advancing to that position, or is the content moving to that position? *)_
--
GitHub Notification of comment by bramus
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/6400#issuecomment-1438604693 using your GitHub account
--
Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config
Received on Tuesday, 21 February 2023 14:41:25 UTC