Video yükleniyor...
Video Yüklenemedi
Switching word combos on scroll with CSS 🖱️ main { animation: switch both steps(3); animation-timeline: view(); } @keyframes switch { to { --i: 3; }} .words__track { translate: 0 calc(var(--i) * -100%); } Result of a DM request 👇
92,985 görüntüleme • 2 yıl önce •via X (Twitter)
10 Yorum

jhey ▲🐻🎈2 yıl önce
Wasn't going to share this one as it was quickly thrown together 😬 May be useful to some though 🤙 Haven't put together a mobile view where could imagine everything would stack and you'd lose the animation. Nor does this fallback where no support 🥲

pavi24102 yıl önce
What's the DOM structure like?

Andrej Maznevski2 yıl önce
So this is what you've been cooking 🧑🍳

jhey ▲🐻🎈2 yıl önce
Not this haha 😂 This was like a 20 minute prototype for someone 🤙

Abdulfettah2 yıl önce
When this gonna be supported on safari

Ivanchis2 yıl önce
👋👋👋

Soya2 yıl önce
thank you! i’ll definitely implement this soon

huang deshiou2 yıl önce
This looks amazing! Can I ask for the code?

LcsGa 🅰️2 yıl önce
Nice effect! To work properly, each part has to be of the same height, right?

ROLLA2 yıl önce
You need to adjust the alignment of the text. It’s a little wonky
