Video wird geladen...

Video konnte nicht geladen werden

Zur Startseite

if you’re dynamically masking a scroll container with css, consider leaving room for the scrollbar instead of masking it too 🧑‍🍳 mask-repeat: no-repeat; mask-size: calc(100% - 10px) 100px;

jh3yy's profile picture

jhey ʕ•ᴥ•ʔ

148,262 subscribers

214,677 Aufrufe • vor 5 Monaten •via X (Twitter)

KunstWissenschaft & Technologie
LIVE

Anya Rossi• Live Now

Private livecam show

0 Kommentare

Keine Kommentare verfügbar

Kommentare vom Original-Post werden hier angezeigt

Ähnliche Videos

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,631 Aufrufe • vor 3 Jahren

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 Aufrufe • vor 5 Monaten

Today is Uniqlo boy again. Mask: UTDisguise Master Mask #siliconemask #masking #malemask #disguisemask
0:18

Sensitive content

Today is Uniqlo boy again. Mask: UTDisguise Master Mask #siliconemask #masking #malemask #disguisemask

pengpeng

28,434 Aufrufe • vor 2 Jahren

N95 mask underneath cloth mask. Every show. #oneofthetwo. (but in reality, 99.5% of the time, it's just me who's masking).
0:15

N95 mask underneath cloth mask. Every show. #oneofthetwo. (but in reality, 99.5% of the time, it's just me who's masking).

Judah Friedlander

108,373 Aufrufe • vor 10 Monaten

#femalemask #femalemasking #mask #siliconsuit #femskin #hot #hotpic #masking #transformation
0:10

#femalemask #femalemasking #mask #siliconsuit #femskin #hot #hotpic #masking #transformation

DenzelW

10,478 Aufrufe • vor 2 Jahren

#femalemask #femalemasking #mask #siliconsuit #femskin #hot #hotpic #masking #transformation
0:19

Sensitive content

#femalemask #femalemasking #mask #siliconsuit #femskin #hot #hotpic #masking #transformation

DenzelW

16,483 Aufrufe • vor 2 Jahren

#femalemask #femalemasking #mask #siliconsuit #femskin #hot #hotpic #masking #transformation
0:12

Sensitive content

#femalemask #femalemasking #mask #siliconsuit #femskin #hot #hotpic #masking #transformation

DenzelW

14,836 Aufrufe • vor 2 Jahren

#femalemask #femalemasking #mask #siliconsuit #femskin #hot #hotpic #masking #transformation
0:10

#femalemask #femalemasking #mask #siliconsuit #femskin #hot #hotpic #masking #transformation

DenzelW

10,538 Aufrufe • vor 1 Jahr

#femalemask #femalemasking #mask #siliconsuit #femskin #hot #hotpic #masking #transformation
0:17

Sensitive content

#femalemask #femalemasking #mask #siliconsuit #femskin #hot #hotpic #masking #transformation

DenzelW

16,295 Aufrufe • vor 3 Jahren

I wonder if anyone suspects a thing...... Mask is Lin by #creafx #femalemask #femalemasking #伪娘 #maletofemale #masking #crossdressing #crossdresser #blackwig
0:14

I wonder if anyone suspects a thing...... Mask is Lin by #creafx #femalemask #femalemasking #伪娘 #maletofemale #masking #crossdressing #crossdresser #blackwig

kimmymasked

16,284 Aufrufe • vor 1 Jahr

Silicone Mask, Full Silicone Suit, No Crotch Opening. Want to see me in it? SO SEXY Character: Raver Or Aerobics Instructor #siliconemask #siliconesuit #mask #disguisecostume #bodysuit #masking #masker #malemasker #maskfetish #gaymask
0:14

Silicone Mask, Full Silicone Suit, No Crotch Opening. Want to see me in it? SO SEXY Character: Raver Or Aerobics Instructor #siliconemask #siliconesuit #mask #disguisecostume #bodysuit #masking #masker #malemasker #maskfetish #gaymask

SirMaskTodd

12,406 Aufrufe • vor 2 Jahren

how the clip + mask combo works: mask the container element using the relevant keycap image so the image is clipped on translate clip the container element so the hit area doesn't overlap other keys 🧑‍🍳
0:18

how the clip + mask combo works: mask the container element using the relevant keycap image so the image is clipped on translate clip the container element so the hit area doesn't overlap other keys 🧑‍🍳

jhey ʕ•ᴥ•ʔ

119,045 Aufrufe • vor 1 Jahr

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 ʕ•ᴥ•ʔ

78,350 Aufrufe • vor 1 Jahr

css trick for the "shine" border 🧑‍🍳 take a pseudoelement position + give it an inset box-shadow mask it off at an angle with a linear-gradient 🤙 bonus: use corner-shape: squircle + rotate on pointer move
0:18

css trick for the "shine" border 🧑‍🍳 take a pseudoelement position + give it an inset box-shadow mask it off at an angle with a linear-gradient 🤙 bonus: use corner-shape: squircle + rotate on pointer move

jhey ʕ•ᴥ•ʔ

200,156 Aufrufe • vor 11 Monaten

you can totally do it with css 🧑‍🍳 use a border mask, layers + overflow: hidden, or other tricks skip animating the gradient though, jus' spin a 1:1 gradient layer 🤙
0:16

you can totally do it with css 🧑‍🍳 use a border mask, layers + overflow: hidden, or other tricks skip animating the gradient though, jus' spin a 1:1 gradient layer 🤙

jhey ʕ•ᴥ•ʔ

286,798 Aufrufe • vor 11 Monaten

A short presentation of the #GreasePencil features of my upcoming tool It dynamically generates a mesh. The rim helps with the quality of the mask The inner area allows for more realistic inner mouths instead of just having a hole in the head #b3d #GeometryNodes #blender
0:19

A short presentation of the #GreasePencil features of my upcoming tool It dynamically generates a mesh. The rim helps with the quality of the mask The inner area allows for more realistic inner mouths instead of just having a hole in the head #b3d #GeometryNodes #blender

Krysidian

35,134 Aufrufe • vor 1 Jahr

This one CSS property will fix your z-index headache. In CSS, a child element with z-index will overlap with any fixed or floating elements outside its container. Instead of stacking higher and higher values to fix it. Use this instead: .card-container { isolation: isolate; } With that, any elements with z-index inside the container will be contained. If you found this useful, follow for more. ❤️
0:19

This one CSS property will fix your z-index headache. In CSS, a child element with z-index will overlap with any fixed or floating elements outside its container. Instead of stacking higher and higher values to fix it. Use this instead: .card-container { isolation: isolate; } With that, any elements with z-index inside the container will be contained. If you found this useful, follow for more. ❤️

Ali

17,112 Aufrufe • vor 6 Monaten

Got carried away with this interactive module for breaking down the CSS mask-image property
0:16

Got carried away with this interactive module for breaking down the CSS mask-image property

rauno

31,639 Aufrufe • vor 1 Jahr

Work is finished! Inthemask by MOLIS Mask | Invidia by SecondFace . #molis #inthemask #invidia #secondface #molifx #siliconemask #femalemask #unmask #masking #fetish #crossdressing #mtf #qipaodress
0:17

Sensitive content

Work is finished! Inthemask by MOLIS Mask | Invidia by SecondFace . #molis #inthemask #invidia #secondface #molifx #siliconemask #femalemask #unmask #masking #fetish #crossdressing #mtf #qipaodress

Moli 茉莉兔兔

20,588 Aufrufe • vor 3 Jahren

Fine. Real-life CSS lesson 🧑‍🍳🍕 .topping { translate: calc(var(--x, 0) * 1cqi) calc(var(--y, 0) * 1cqi); transition: translate 0.2s; } [id=slide]:checked ~ .scene .topping { --x: 100; } cc David East
0:17

Fine. Real-life CSS lesson 🧑‍🍳🍕 .topping { translate: calc(var(--x, 0) * 1cqi) calc(var(--y, 0) * 1cqi); transition: translate 0.2s; } [id=slide]:checked ~ .scene .topping { --x: 100; } cc David East

jhey ʕ•ᴥ•ʔ

154,642 Aufrufe • vor 3 Jahren