Post

Nmn
@nmn.sh

So thinking about elements that only become visible when they get stuck. So look at that scroll spy in your example, it could be done purely with “stuck” state detection. Put a copy of the header above each section. Make it “appear” only when stuck. Make sure there’s a tiny bit of overlap.

Adam Argyle
@nerdy.dev

oooooh, indeed! have not seen this trick, but i dont know if calling it a "trick" is fair, seems like legit uses and clever linking to me! cool!

0 reposts2 likes

Nmn
@nmn.sh

Still trying to figure out the overlap bit. Assume a bit of negative margins on the containers will do the trick. About to install Chrome 133 to try it out in a bit.

Nmn
@nmn.sh

Also, another use case is scroll-driven shadows. Already possible with sticky position today, but they “wipe” from the bottom and can look slightly wrong. Stuck state + css transition should let us fade them in and out as the designers intended!

Adam Argyle
@nerdy.dev

ooo, show me when you're done. i did a scroll shadow demo with scroll-state(), but i kinda prefer the one i've made with scroll driven animation. feels better linked than triggered, but maybe you'll convince me otherwise!