正在加载视频...
视频加载失败
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 👇
10 条评论

jhey ▲🐻🎈1 年前
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 🥲

pavi24101 年前
What's the DOM structure like?

Andrej Maznevski1 年前
So this is what you've been cooking 🧑🍳

jhey ▲🐻🎈1 年前
Not this haha 😂 This was like a 20 minute prototype for someone 🤙

Abdulfettah1 年前
When this gonna be supported on safari

Ivanchis1 年前
👋👋👋

Soya1 年前
thank you! i’ll definitely implement this soon

huang deshiou1 年前
This looks amazing! Can I ask for the code?

LcsGa 🅰️1 年前
Nice effect! To work properly, each part has to be of the same height, right?

ROLLA1 年前
You need to adjust the alignment of the text. It’s a little wonky
