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

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

На главную

emoji picker sphere 🌐 two-axis css scroll-driven animation spins a 3D globe where "most used" sit along the equator ↓

jh3yy's profile picture

jhey ʕ•ᴥ•ʔ

148,261 subscribers

19,876 просмотров • 1 день назад •via X (Twitter)

Наука и технологии
LIVE

Anya Rossi• Live Now

Private livecam show

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

Нет доступных комментариев

Здесь появятся комментарии из оригинального поста

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

Scroll driven animation with CSS animation-timeline: view(); animation-range: entry, exit;
0:11

Scroll driven animation with CSS animation-timeline: view(); animation-range: entry, exit;

Solarin

21,075 просмотров • 1 год назад

Future CSS Tip! 🔮 Create that cool gallery effect with the scroll-driven animations API 😎 ul, img { animation-timeline: scroll(root); 👈 animation: spin; } ul { --r: 270deg; } img { --r: -270deg; } keyframes spin { to { rotate: var(--r); }} CodePen.IO link below! 👇
0:15

Future CSS Tip! 🔮 Create that cool gallery effect with the scroll-driven animations API 😎 ul, img { animation-timeline: scroll(root); 👈 animation: spin; } ul { --r: 270deg; } img { --r: -270deg; } keyframes spin { to { rotate: var(--r); }} CodePen.IO link below! 👇

jhey ʕ•ᴥ•ʔ

111,247 просмотров • 3 лет назад

the best emoji picker for macos
0:12

the best emoji picker for macos

Pedro Duarte

13,274 просмотров • 1 год назад

💡 CSS Tip! Create a Sticky Header that "sticks"! A fancy effect powered by Scroll-Driven Animations and shape().
0:10

💡 CSS Tip! Create a Sticky Header that "sticks"! A fancy effect powered by Scroll-Driven Animations and shape().

CSS by T. Afif

22,524 просмотров • 6 месяцев назад

I put together some Tailwind CSS utilities for masking/fading edges of scroll containers using scroll-driven animations. Link below ↓
0:11

I put together some Tailwind CSS utilities for masking/fading edges of scroll containers using scroll-driven animations. Link below ↓

Tim Wilson

53,030 просмотров • 5 месяцев назад

100% css 0% javascript Pretty cool that you can run animations like this now off the main thread, was always a worry implementing a scroll animation knowing some users might see "jank" Safari and Firefox are sleeping far too long, scroll driven animations are awesome
0:14

100% css 0% javascript Pretty cool that you can run animations like this now off the main thread, was always a worry implementing a scroll animation knowing some users might see "jank" Safari and Firefox are sleeping far too long, scroll driven animations are awesome

Dev Ed

88,238 просмотров • 1 год назад

Single-axis scroll containers fix long-standing CSS overflow quirks → Key capabilities ready for testing in Chrome 153 (Beta, Dev, or Canary): 📌 Pair `auto` with `clip` to enable a single-axis scroll container 🔍 Detect support reliably using `@ supports named-feature()` 🚫 Prevent accidental two-dimensional scrollers in your layouts
0:12

Single-axis scroll containers fix long-standing CSS overflow quirks → Key capabilities ready for testing in Chrome 153 (Beta, Dev, or Canary): 📌 Pair `auto` with `clip` to enable a single-axis scroll container 🔍 Detect support reliably using `@ supports named-feature()` 🚫 Prevent accidental two-dimensional scrollers in your layouts

Chrome for Developers

15,752 просмотров • 1 месяц назад

wavy carousel with CSS scroll driven animations not exactly like OP but fun to try replicate
0:17

wavy carousel with CSS scroll driven animations not exactly like OP but fun to try replicate

Wes Bos

71,941 просмотров • 10 месяцев назад

💡 CSS Tip! Get the scroll progress of the page as a CSS variable using a few lines of code ✅ Powered by Scroll driven animations ✅ Defined at the root level ✅ Typed using @​property ✅ You can easily use it within any formula CodePen.IO demo in the reply 👇
0:11

💡 CSS Tip! Get the scroll progress of the page as a CSS variable using a few lines of code ✅ Powered by Scroll driven animations ✅ Defined at the root level ✅ Typed using @​property ✅ You can easily use it within any formula CodePen.IO demo in the reply 👇

CSS by T. Afif

35,659 просмотров • 2 лет назад

kinda wild how far you can get with CSS alone a scroll animation tied to the content scroll powers the percentage update + icon animation interpolate-size provides a way to transition the popover between button size and content size using starting-style 🤙
0:17

kinda wild how far you can get with CSS alone a scroll animation tied to the content scroll powers the percentage update + icon animation interpolate-size provides a way to transition the popover between button size and content size using starting-style 🤙

jhey ʕ•ᴥ•ʔ

121,066 просмотров • 2 лет назад

That SVG filter is the whole reason this CSS scroll animation is even possible 🙏 (now with improved timing ✨)
0:16

That SVG filter is the whole reason this CSS scroll animation is even possible 🙏 (now with improved timing ✨)

jhey ʕ•ᴥ•ʔ

94,110 просмотров • 2 лет назад

#BOUEVE... 🔜 Where will you be watching from across the globe? 🌐
0:12

#BOUEVE... 🔜 Where will you be watching from across the globe? 🌐

AFC Bournemouth 🍒

14,661 просмотров • 2 месяцев назад

Celebrating Shopify merchants around the globe on the most important weekend of the year! Absolutely stunning - thank you Sphere 🤩🌎
0:13

Celebrating Shopify merchants around the globe on the most important weekend of the year! Absolutely stunning - thank you Sphere 🤩🌎

Brennan Loh

52,281 просмотров • 2 лет назад

💡 Do you know about the `clip` value? In CSS, we can clip a container along a single axis by using the `clip` value. Learn more in this interactive article about the `clip` value:
0:17

💡 Do you know about the `clip` value? In CSS, we can clip a container along a single axis by using the `clip` value. Learn more in this interactive article about the `clip` value:

Ahmad Shadeed

10,533 просмотров • 1 год назад

Custom React Native emoji picker made for Superchat ✨
0:13

Custom React Native emoji picker made for Superchat ✨

Laurids 🇪🇺🇺🇦

11,442 просмотров • 2 лет назад

"CSS <color-input> Color Picker" by Adam Argyle
0:12

"CSS <color-input> Color Picker" by Adam Argyle

CodePen.IO

12,097 просмотров • 11 месяцев назад