Загрузка видео...

Не удалось загрузить видео

На главную

What if the scrollbar went around the corner? 👀 CSS could do that ✨

847,069 просмотров • 2 лет назад •via X (Twitter)

Комментарии: 10

Фото профиля jhey ▲🐻🎈
jhey ▲🐻🎈2 лет назад

Don't be put off by the JavaScript 😅 It's there for generating SVG paths, etc. based on updated user configuration 🤙 It's also there to cover where CSS scroll-driven animations don't work ✨

Фото профиля Anatoly Lobkov
Anatoly Lobkov2 лет назад

When at the top of a list, the user may not understand the meaning of the small white circle until they interact. But at the same time, what prevents us from supporting the evolution of user experience hehehe

Фото профиля jhey ▲🐻🎈
jhey ▲🐻🎈2 лет назад

Magic here is that scroll-snap means it won't sit in the circle mode 😎 That only appears when you scroll past the snap points ✨

Фото профиля Ritika Agrawal
Ritika Agrawal2 лет назад

🤯 The code please!

Фото профиля Dany
Dany2 лет назад

Ok devs stop everything you're building and make this industry standard.

Фото профиля Shubham Verma🌱
Shubham Verma🌱2 лет назад

If you ever release a in-depth advanced css course, I'd get it within a minute. Absolute🐐

Фото профиля Álvaro Montoro
Álvaro Montoro2 лет назад

stroke-dashoffset with scroll-driven animations?

Фото профиля jhey ▲🐻🎈
jhey ▲🐻🎈2 лет назад

Will clean up the code and get it out there 🤙 Pretty much yeah, some scroll-snap, scroll animation, and SVG 😎

Фото профиля Artur Bień
Artur Bień2 лет назад

Nice! One missing detail - the scrollbar thumb should get thicker as it shrinks 🤓

Фото профиля jhey ▲🐻🎈
jhey ▲🐻🎈2 лет назад

Yeah, didn't like that detail so skipped it out 😅 Seems I wasn't the only one. Might add it as an option. Jus requires adding stroke-width into the keyframe ✨ Was more concerned with hacking something up that would work responsively in the end 😁

Похожие видео