 📝 Solved by CSS Scroll-Driven Animations: hide a header when scrolling down, show it again only when scrolling up again. By adding a long transition-delay to a CSS property under certain conditions (which you can do using a Style Query), you can persist its value. 🔗 https://brm.us/scroll-driven-header Demo by @fcalderan. 2 comments
@bramus I think I've solved that issue you noticed: I set an higher transition delay for the scroll-delayed property so it's longer just a bit more than the transition duration of the header (probably I updated the demo after your article). Anyway I commented all the CSS code and now it works fine for what I tested so far. 🙂 |
Gregory's Server
@bramus @fcalderan I find this to be an anti-pattern for usability. Often times when I'm reading a site that uses this, I feel like I have to fight with the site and produce a scroll pattern "just right" so that I can again access the site header. I wish it would either be sticky or not.