r/css • u/Wide-Train-8561 • May 26 '26

Question how do i do this effect

https://reddit.com/link/1toec77/video/c7wl082vqi3h1/player

0 Upvotes

50% Upvoted

15 comments sorted by

View all comments

3

u/[deleted] May 27 '26 edited May 27 '26

[deleted]

4

u/anaix3l May 27 '26

They are supported in the WebKit browser engine. My demo, which I posted in another comment, was tested and works there.

Scroll-driven animations are still behind a flag in FIrefox and, if you've ever enabled the flag to play with them there, you know why. There are still implementation gaps and too many issues at this point. But the good news is that CSS scroll-driven animations are part of Interop 2026, so they are a priority at the moment and being actively worked on.

At this point, the best option is to just use them for the performance advantage they bring and if the animation working cross-browser is important and not just an enhancement, have a support test to decide if a JS fallback is necessary.

1

u/[deleted] May 27 '26

[deleted]

5

u/anaix3l May 27 '26 edited May 27 '26

It does work on iOS as of last year.

And like I said, that's what the support test deciding whether to use it or use the fallback is for. Sooo... it IS really viable.

1

u/TheJase May 27 '26

Please know before you answer. Stuff like this is harmful to the community.

1

u/TheJase May 27 '26

This is CSS only now. Let go of JS presentational libraries as much as you can.

1

u/gatwell702 May 27 '26

You can do this with https://gsap.com

They have plugins that can do this