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

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

На главную

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

mgechev's profile picture

Minko Gechev

57,930 subscribers

108,671 просмотров • 3 лет назад •via X (Twitter)

LIVE

Anya Rossi• Live Now

Private livecam show

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

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

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

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

💡 CSS Tip! Do you know that One-Time password field? You can create it using only one input and a few lines of CSS. The HTML: <input type="text" maxlength="6"> Code & Demo: You can control the number of characters by adjusting the maxlength attribute.
0:14

💡 CSS Tip! Do you know that One-Time password field? You can create it using only one input and a few lines of CSS. The HTML: <input type="text" maxlength="6"> Code & Demo: You can control the number of characters by adjusting the maxlength attribute.

CSS by T. Afif

25,194 просмотров • 1 год назад

Tailwind CSS Tip ✨ You can create a floating input form with Tailwind CSS using ":placeholder-shown" pseudo class. Live Demo & Code 👇 (8/30) follow for 22 more tips 🔔
0:17

Tailwind CSS Tip ✨ You can create a floating input form with Tailwind CSS using ":placeholder-shown" pseudo class. Live Demo & Code 👇 (8/30) follow for 22 more tips 🔔

Surjith S M ✪

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

1/ Today, Veo 2, our state-of-the-art video model, is rolling out to Gemini Advanced + Whisk! You can create 8s, high-res videos from text prompts in Google Gemini with fluid character movement + lifelike scenes across a range of styles. Tip: the more detailed your description, the better.
0:16

1/ Today, Veo 2, our state-of-the-art video model, is rolling out to Gemini Advanced + Whisk! You can create 8s, high-res videos from text prompts in Google Gemini with fluid character movement + lifelike scenes across a range of styles. Tip: the more detailed your description, the better.

Sundar Pichai

295,426 просмотров • 1 год назад

💡CSS Tip! Create a tooltip that follows an anchor with modern CSS! No JavaScript is used to control the position of the tooltip or its tail. It's 100% CSS magic!
0:16

💡CSS Tip! Create a tooltip that follows an anchor with modern CSS! No JavaScript is used to control the position of the tooltip or its tail. It's 100% CSS magic!

CSS by T. Afif

57,769 просмотров • 8 месяцев назад

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 ✨
0:17

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 ✨

jhey ʕ•ᴥ•ʔ

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

💡 DevTools tip: You can make your console.log stand out by adding some CSS to it! 🎨
0:13

💡 DevTools tip: You can make your console.log stand out by adding some CSS to it! 🎨

bolt.new

32,637 просмотров • 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,451 просмотров • 1 год назад

Tailwind CSS Tip ✨ You can create some cool looking loaders and spinners using Tailwind CSS. Thanks to Tailscan for Tailwind CSS for the inspiration. Demo & Code 👇 (14/30) follow for 16 more tips 🔔
0:11

Tailwind CSS Tip ✨ You can create some cool looking loaders and spinners using Tailwind CSS. Thanks to Tailscan for Tailwind CSS for the inspiration. Demo & Code 👇 (14/30) follow for 16 more tips 🔔

Surjith S M ✪

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

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 лет назад

CSS Tip! ✨ Did you know you can animate CSS Grid tracks? 👀 ul:is(:hover,:focus-within) {--active: 1;} ul { grid-template-columns: auto repeat(3, calc(10px + (var(--active) * 100px))); transition: all 0.2s; } Adjust layouts based on interaction! 😎 CodePen.IO link below! 👇
0:18

CSS Tip! ✨ Did you know you can animate CSS Grid tracks? 👀 ul:is(:hover,:focus-within) {--active: 1;} ul { grid-template-columns: auto repeat(3, calc(10px + (var(--active) * 100px))); transition: all 0.2s; } Adjust layouts based on interaction! 😎 CodePen.IO link below! 👇

jhey ʕ•ᴥ•ʔ

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

I made a version of this using only modern CSS. 👀
0:13

I made a version of this using only modern CSS. 👀

H. Kyle Foster

64,822 просмотров • 7 месяцев назад

📝 Solved by CSS Scroll-Driven Animations: hide a header when scrolling down, show it again when scrolling up By adding a long transition-delay to a CSS property under certain conditions (with a Style Query), you can persist its value Demo by Fabrizio Calderan
0:16

📝 Solved by CSS Scroll-Driven Animations: hide a header when scrolling down, show it again when scrolling up By adding a long transition-delay to a CSS property under certain conditions (with a Style Query), you can persist its value Demo by Fabrizio Calderan

Bram.us (by @bramus)

15,617 просмотров • 1 год назад

Offside according to yesterdays linesman, one of a number of questionable decisions. How can you get this that badly wrong 🤯🤯
0:10

Offside according to yesterdays linesman, one of a number of questionable decisions. How can you get this that badly wrong 🤯🤯

Bustleholme FC

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

More of a fun fact than a tip but you can kill those pesky sentries on the towers using focus light to set the towers on fire 🔥
0:10

More of a fun fact than a tip but you can kill those pesky sentries on the towers using focus light to set the towers on fire 🔥

KJPlays

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

CSS Tip! 🤙 These buttons from Michaël are ace 🔥 But, how would you make them? 👀 You could use background-attachment: fixed and update a conic-gradient position depending on the interaction design 🤔 CodePen.IO link below! 👇
0:18

CSS Tip! 🤙 These buttons from Michaël are ace 🔥 But, how would you make them? 👀 You could use background-attachment: fixed and update a conic-gradient position depending on the interaction design 🤔 CodePen.IO link below! 👇

jhey ʕ•ᴥ•ʔ

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

You can finally apply transitions on CSS display property. 👀 Combining both transition behavior and starting style, Here's how it works:
0:13

You can finally apply transitions on CSS display property. 👀 Combining both transition behavior and starting style, Here's how it works:

Ali

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

#RiseoftheRonin Weapons: Katana By freely combining these based on enemies' weapons and your own combat style, you can enjoy a wide range of tactics. Introducing the actions and techniques of the "katana" and its combat styles, "Mumyo-ryu" and "Hokushin Itto-ryu."
0:13

#RiseoftheRonin Weapons: Katana By freely combining these based on enemies' weapons and your own combat style, you can enjoy a wide range of tactics. Introducing the actions and techniques of the "katana" and its combat styles, "Mumyo-ryu" and "Hokushin Itto-ryu."

Team NINJA

31,447 просмотров • 1 год назад

3d world abilities of AI models keep getting better, this is @Kling_AI 1.5 It can move around a space in 3d and you can steer its camera movements All based on a single input image
0:10

3d world abilities of AI models keep getting better, this is @Kling_AI 1.5 It can move around a space in 3d and you can steer its camera movements All based on a single input image

@levelsio

112,201 просмотров • 1 год назад

Amazing display of strength to pull out the boar using only its teeth.
0:13

Amazing display of strength to pull out the boar using only its teeth.

Damn Nature You Scary

57,698 просмотров • 8 месяцев назад