Post

#CSS feature faceoff: scroll triggered stuck nav (left) vs scroll driven animation nav (right) which do you prefer? try it codepen.io/argyleink/pe... (use Canary for the scroll-state() support)

Adam Argyle

@nerdy.dev

Also, the right side could be customized so it takes less scroll to fade in. There are levers that can be adjusted.

31/12/24, 12:24 am0 reposts4 likes

Permik

@permik.bsky.social

31 Dec 2024

Aww, you can't use timing functions to delinearize the animation behavior easily when using the animation timeline stuff :/ Alternatively some temporal delay could be a cool thing to be able to edit. I love how the transition one doesn't just instantly disappear when scrolling to the top.

Permik

@permik.bsky.social

31 Dec 2024

If I'd use this, I'd probably mash these two examples together that when you're going upwards, I change the animation for the transition one and when you've reached the top, I'd use the scroll timeline to fade the bar in when the bar has been made transparent.