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

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

На главную

Complex UI: New web APIs in disguise 🥸 These balance sliders are basic input [type=range] with labels and some extra elements The magic comes from using a scroll animation on the range thumb and using it to drive a custom property that updates styles on the visuals ✨

jh3yy's profile picture

jhey ʕ•ᴥ•ʔ

145,970 subscribers

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

LIVE

Anya Rossi• Live Now

Private livecam show

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

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

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

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

extra detail: animate a CSS custom property from 0 to 100 on scroll and use that for a counter() label::after { content: counter(complete) '% complete'; } translate the label using container query units ✨ translate: 0 calc(var(--p) * 1cqh);
0:10

extra detail: animate a CSS custom property from 0 to 100 on scroll and use that for a counter() label::after { content: counter(complete) '% complete'; } translate the label using container query units ✨ translate: 0 calc(var(--p) * 1cqh);

jhey ʕ•ᴥ•ʔ

77,042 просмотров • 1 год назад

Let’s design a custom scroll indicator using the newly released scroll APIs in iOS 18!
0:16

Let’s design a custom scroll indicator using the newly released scroll APIs in iOS 18!

Kavsoft

12,058 просмотров • 1 год назад

I've started using Base UI for Hypermode's new UI components and I'm absolutely loving it. The component API's are excellent, and the DX in pairing it up with Motion has been seamless. WIP of a new Hypermode dialog with form elements built on BaseUI 👇
0:14

I've started using Base UI for Hypermode's new UI components and I'm absolutely loving it. The component API's are excellent, and the DX in pairing it up with Motion has been seamless. WIP of a new Hypermode dialog with form elements built on BaseUI 👇

Derek Briggs

14,903 просмотров • 1 год назад

Tip: *only* using CSS you can apply styles to a number input conditionally depending on whether its value is within our out of range 🤯
0:12

Tip: *only* using CSS you can apply styles to a number input conditionally depending on whether its value is within our out of range 🤯

Minko Gechev

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

the fact that Caleb is the type of person to scroll his phone using both his index finger and his thumb is somehow incredibly fitting
0:10

the fact that Caleb is the type of person to scroll his phone using both his index finger and his thumb is somehow incredibly fitting

Sparrow 🍎 HAPPY 兄VERSARY🐆

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

In #Kotlin 1.9, instead of using the "until" infix function to create a range that's exclusive on its upper bound, you can use the new open-ended range operator... or as I like to call it, the alligator operator.
0:15

In #Kotlin 1.9, instead of using the "until" infix function to create a range that's exclusive on its upper bound, you can use the new open-ended range operator... or as I like to call it, the alligator operator.

Dave Leeds

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

BREAKING: You can now edit Grok Imagine creations on the web using a prompt. Type the edit you want and get two new versions in seconds. Try it now!
0:18

BREAKING: You can now edit Grok Imagine creations on the web using a prompt. Type the edit you want and get two new versions in seconds. Try it now!

DogeDesigner

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

🚨🇷🇺🇺🇦 BREAKING - The Russians are consistently “panicking”. According to the occupiers’ military Telegram channels, Ukraine is now intensively — almost nightly — using domestically produced Neptune-type cruise missiles together with long-range kamikaze drones to strike targets in Crimea, primarily air-defense systems, their radars, and military facilities. Those reports say the northwestern part of the peninsula remains under heavy and continuous pressure from Ukrainian long-range FPV and Lancet-like loitering munitions (a Ukrainian analogue referred to as a BULAVA-type drone). 🔵 The information also claims that Ukraine’s Main Intelligence Directorate (HUR) may be preparing limited landing/raid operations to hit Russian logistics lines and disrupt Russian reserves in various directions. According to some sources, Ukrainian diversionary networks inside Crimea are becoming more active, and there are even claims that Ukraine plans to begin using long-range underwater (submersible) drones. See the latest updates with us: Visioner
0:17

🚨🇷🇺🇺🇦 BREAKING - The Russians are consistently “panicking”. According to the occupiers’ military Telegram channels, Ukraine is now intensively — almost nightly — using domestically produced Neptune-type cruise missiles together with long-range kamikaze drones to strike targets in Crimea, primarily air-defense systems, their radars, and military facilities. Those reports say the northwestern part of the peninsula remains under heavy and continuous pressure from Ukrainian long-range FPV and Lancet-like loitering munitions (a Ukrainian analogue referred to as a BULAVA-type drone). 🔵 The information also claims that Ukraine’s Main Intelligence Directorate (HUR) may be preparing limited landing/raid operations to hit Russian logistics lines and disrupt Russian reserves in various directions. According to some sources, Ukrainian diversionary networks inside Crimea are becoming more active, and there are even claims that Ukraine plans to begin using long-range underwater (submersible) drones. See the latest updates with us: Visioner

Visioner

551,944 просмотров • 9 месяцев назад

How do you turn a type specimen into an experience? For Exat, Studio Size pushed the typography showcase beyond the static page, using scroll, motion, and interaction to reveal the logic, range, and character of Hot Type's most ambitious typeface yet:
0:15

How do you turn a type specimen into an experience? For Exat, Studio Size pushed the typography showcase beyond the static page, using scroll, motion, and interaction to reveal the logic, range, and character of Hot Type's most ambitious typeface yet:

Codrops

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

A Bangladeshi man is urinating into the seawater from one ship. At the same time, on another ship, some Bangladeshis are taking that same water in buckets, washing utensils with it, and even using it to cook food.
0:15

A Bangladeshi man is urinating into the seawater from one ship. At the same time, on another ship, some Bangladeshis are taking that same water in buckets, washing utensils with it, and even using it to cook food.

Saffron Chargers

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

Based on the WWDC 2026 leaks, I tried to recreate the iOS 27 revamped Siri interaction inside the Dynamic Island in swift ui with lots of different settings and some custom shaders. And yeah, if it’s like that, it will be kinda boring going from a rainbow like ui to a monochrome one.
0:14

Based on the WWDC 2026 leaks, I tried to recreate the iOS 27 revamped Siri interaction inside the Dynamic Island in swift ui with lots of different settings and some custom shaders. And yeah, if it’s like that, it will be kinda boring going from a rainbow like ui to a monochrome one.

Tykra

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

In the Residencial del Lago area, SEDENA forces opened fire on a CDS/CH armored vehicle using long-range weapons and a Browning machine gun mounted on a DN-XI.
0:20

In the Residencial del Lago area, SEDENA forces opened fire on a CDS/CH armored vehicle using long-range weapons and a Browning machine gun mounted on a DN-XI.

Cartel Watch

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

A little sneak peek into one of many animations done for a new project Last9. 🙈 → The motion is in sync with the scroll progress. Created using SCSS and a little bit Svelte magic to control the CSS Variables.
0:10

A little sneak peek into one of many animations done for a new project Last9. 🙈 → The motion is in sync with the scroll progress. Created using SCSS and a little bit Svelte magic to control the CSS Variables.

Tushar

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

Animate MetaHumans in real time using performances performances captured from most webcams and a wide range of smartphones. Or make some noise and generate real-time animation solely from an audio source, MetaHuman Animator now captures the emotion of a speaker, combining this with the plausible head movement feature for more lifelike results:
0:17

Animate MetaHumans in real time using performances performances captured from most webcams and a wide range of smartphones. Or make some noise and generate real-time animation solely from an audio source, MetaHuman Animator now captures the emotion of a speaker, combining this with the plausible head movement feature for more lifelike results:

Unreal Engine

22,417 просмотров • 1 год назад

Viktor Hovland was spotted using pool floaties as a training aid on the WMPO range 💀
0:19

Viktor Hovland was spotted using pool floaties as a training aid on the WMPO range 💀

Fore Play

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

What are you doing on this #SelfCareSaturday? Me and the BFF Chef are in the kitchen using some of my gifted ingredients #AsEverOfficial from the Duchess to make fresh lemon 🍋 custard as seen on #FindingItaly and using the edible flowers from #WithLoveMeghan
0:40

What are you doing on this #SelfCareSaturday? Me and the BFF Chef are in the kitchen using some of my gifted ingredients #AsEverOfficial from the Duchess to make fresh lemon 🍋 custard as seen on #FindingItaly and using the edible flowers from #WithLoveMeghan

Sophia A. Nelson

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

If you are using my UI or are using Cooldown Manager Centered, a new experimental feature just dropped allowing you to see your keypress overlay on the Cooldown Manager! My Free Midnight UI available:
0:10

If you are using my UI or are using Cooldown Manager Centered, a new experimental feature just dropped allowing you to see your keypress overlay on the Cooldown Manager! My Free Midnight UI available:

Luxthos

65,579 просмотров • 4 месяцев назад

Custom styles for Infographics are rolling out TODAY! With 10 (!) preset options and the ability to create your own, choose from editorial, clay, brick, fan favorite kawaii 😻, and more! Turn your complex source material into beautiful, easy-to-read visuals with a single click.
0:19

Custom styles for Infographics are rolling out TODAY! With 10 (!) preset options and the ability to create your own, choose from editorial, clay, brick, fan favorite kawaii 😻, and more! Turn your complex source material into beautiful, easy-to-read visuals with a single click.

NotebookLM

259,916 просмотров • 4 месяцев назад