Video yükleniyor...

Video Yüklenemedi

Ana Sayfaya Dön

magnetic bento hover effect w/ css anchor positioning .bento { li:hover article { anchor-name: --a; } .indicator { position-anchor: --a; inset: anchor(inside); transition: inset var(--dur) var(--ease); } }

jh3yy's profile picture

jhey ʕ•ᴥ•ʔ

147,632 subscribers

82,655 görüntüleme • 3 gün önce •via X (Twitter)

EğitimBilim & Teknoloji
LIVE

Anya Rossi• Live Now

Private livecam show

0 Yorum

Yorum bulunmuyor

Orijinal gönderinin yorumları burada görünecek

Benzer Videolar

Responsive magnetic link effect using CSS anchor positioning 🧲 nav li:nth-of-type(2) { anchor-name: --i2; } nav:has(li:nth-of-type(2) a:hover) { --a: --i2; } ul::before { /* indicator */ left: anchor(var(--a) left); width: anchor-size(var(--a) width); }
0:17

Responsive magnetic link effect using CSS anchor positioning 🧲 nav li:nth-of-type(2) { anchor-name: --i2; } nav:has(li:nth-of-type(2) a:hover) { --a: --i2; } ul::before { /* indicator */ left: anchor(var(--a) left); width: anchor-size(var(--a) width); }

jhey ʕ•ᴥ•ʔ

396,709 görüntüleme • 2 yıl önce

progressive css-only pagination indicators w/ anchor positioning 👨‍🍳 nav::before { position-anchor: --h; } nav::before { left: anchor(left); } a:hover { anchor-name: --h; } use the nav pseudoelements, ::before for intent, ::after for current 🤙
0:16

progressive css-only pagination indicators w/ anchor positioning 👨‍🍳 nav::before { position-anchor: --h; } nav::before { left: anchor(left); } a:hover { anchor-name: --h; } use the nav pseudoelements, ::before for intent, ::after for current 🤙

jhey ʕ•ᴥ•ʔ

193,079 görüntüleme • 11 ay önce

table of contents marker w/ modern css 🧑‍🍳 .toc { scroll-target-group: auto; } a:target-current { anchor-name: --active; } .toc::after { position-anchor: --active; top: anchor(top); } fun progressive enhancement, no js 🤙
0:15

table of contents marker w/ modern css 🧑‍🍳 .toc { scroll-target-group: auto; } a:target-current { anchor-name: --active; } .toc::after { position-anchor: --active; top: anchor(top); } fun progressive enhancement, no js 🤙

jhey ʕ•ᴥ•ʔ

178,293 görüntüleme • 9 ay önce

Build Flow Charts with #CSS Anchor Positioning
0:10

Build Flow Charts with #CSS Anchor Positioning

Cory Rylan

28,527 görüntüleme • 2 yıl önce

In case you missed it, I wrote about the basics CSS Anchor Positioning. 🔗
0:16

In case you missed it, I wrote about the basics CSS Anchor Positioning. 🔗

Ahmad Shadeed

38,739 görüntüleme • 1 yıl önce

CSS view transitions + anchor positioning now let you easily build smooth SPA-like navigation on a good old static website!
0:11

CSS view transitions + anchor positioning now let you easily build smooth SPA-like navigation on a good old static website!

Benjamin De Cock

138,927 görüntüleme • 6 ay önce

A fun CSS-only experimentation using modern features (anchor positioning, @​property, :has(), and more!) for this week #codepenchallenge Demo: via CodePen.IO
0:17

A fun CSS-only experimentation using modern features (anchor positioning, @​property, :has(), and more!) for this week #codepenchallenge Demo: via CodePen.IO

CSS by T. Afif

12,160 görüntüleme • 1 yıl önce

Demonstrating a drywall anchor
0:10

Demonstrating a drywall anchor

Interesting AF

7,118,153 görüntüleme • 1 yıl önce

💡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,924 görüntüleme • 1 yıl önce

WHAT A GAME! Anchor Down! Vanderbilt Football
0:12

WHAT A GAME! Anchor Down! Vanderbilt Football

Nate Bargatze

65,993 görüntüleme • 10 ay önce

Hollow drywall anchor
0:16

Hollow drywall anchor

World of Engineering

152,971 görüntüleme • 5 ay önce

Always a vibe w/ my co-anchor, friend and fellow ATL native ⁦Faith Jessie⁩
0:12

Always a vibe w/ my co-anchor, friend and fellow ATL native ⁦Faith Jessie⁩

Jonathan Martin

771,270 görüntüleme • 2 yıl önce

Hollow wall anchor
0:18

Hollow wall anchor

World of Engineering

500,784 görüntüleme • 1 yıl önce

Average B site anchor
0:15

Average B site anchor

Unfortunate Counter-Strike

166,978 görüntüleme • 3 yıl önce

Anchor Man🧱🛡️
0:14

Anchor Man🧱🛡️

(fan)Rodri

645,325 görüntüleme • 1 ay önce

Typical B-anchor round 😁
0:12

Typical B-anchor round 😁

Market.CSGO

38,227 görüntüleme • 6 ay önce

Anchor Under Mast #NIKKE #cosplay
0:13

Anchor Under Mast #NIKKE #cosplay

mongza

149,850 görüntüleme • 3 ay önce

Fixing a ceiling anchor hole using a metal mesh drywall patch.
0:10

Fixing a ceiling anchor hole using a metal mesh drywall patch.

Gisa w'I Rwanda🇷🇼❤️🇷🇼

29,213 görüntüleme • 3 ay önce