Video yükleniyor...

Video Yüklenemedi

Ana Sayfaya Dön

css cyber[popover] 2025 w/ sfx (jus' javascript for the audio and keyboard shortcuts)

jh3yy's profile picture

jhey ʕ•ᴥ•ʔ

135,805 subscribers

109,063 görüntüleme • 11 ay önce •via X (Twitter)

Bilim & TeknolojiEğitimSanat
LIVE

Anya Rossi• Live Now

Private livecam show

11 Yorum

jhey ʕ•ᴥ•ʔ profil fotoğrafı
jhey ʕ•ᴥ•ʔ11 ay önce

here's the @CodePen for this one 🚀 (toggle "muted" for the sound effects)

Mobile Scanner profil fotoğrafı
Mobile Scanner1 yıl önce

Scan any documents, convert images into text, PDF files, etc. 👍

CG profil fotoğrafı
CG11 ay önce

cyberpunk 2077 vibes 🔥🔥🔥💯💯💯

caiodev profil fotoğrafı
caiodev11 ay önce

dope @uphiago

Steve Lauda profil fotoğrafı
Steve Lauda11 ay önce

Vibeeeee

Sean profil fotoğrafı
Sean11 ay önce

ooooo this is cool

lear profil fotoğrafı
lear11 ay önce

take it as a compliment :)

illia 🇺🇦 profil fotoğrafı
illia 🇺🇦11 ay önce

cool shit! can’t believe how far web platform has come

Don Carlos profil fotoğrafı
Don Carlos11 ay önce

Code plz ? 🥹

jhey ʕ•ᴥ•ʔ profil fotoğrafı
jhey ʕ•ᴥ•ʔ11 ay önce

i got you 🤙

sutra profil fotoğrafı
sutra11 ay önce

It’s like every terminal in every space rpg in modern times

Benzer Videolar

iOS-style morphing context menu w/ css transitions 👨‍🍳 [popover] api + anchor positioning + transition-behavior: allow-discrete
0:31

iOS-style morphing context menu w/ css transitions 👨‍🍳 [popover] api + anchor positioning + transition-behavior: allow-discrete

jhey ʕ•ᴥ•ʔ

30,546 görüntüleme • 4 ay önce

Ready for the first cool demo of the year? A mini Mario world with keyboard control. Yes, you can move Mario and also jump! 👀 Demo: via CodePen.IO ✔️ 100% CSS Magic ✔️ Minimal HTML ❌ 0% JavaScript A Chrome-only experimentation using modern CSS.
0:25

Ready for the first cool demo of the year? A mini Mario world with keyboard control. Yes, you can move Mario and also jump! 👀 Demo: via CodePen.IO ✔️ 100% CSS Magic ✔️ Minimal HTML ❌ 0% JavaScript A Chrome-only experimentation using modern CSS.

CSS by T. Afif

36,193 görüntüleme • 5 ay önce

Popover nav bar without JavaScript 🤙 <nav><ul><li><button popovertarget=menu>... <div popover=auto id=menu> ...content </div> Tweak timings with CSS linear() 🎬 Transitions with @​starting-style Anchor positioning to position and size things 🤏
0:44

Popover nav bar without JavaScript 🤙 <nav><ul><li><button popovertarget=menu>... <div popover=auto id=menu> ...content </div> Tweak timings with CSS linear() 🎬 Transitions with @​starting-style Anchor positioning to position and size things 🤏

jhey ▲🐻🎈

124,577 görüntüleme • 1 yıl önce

responsive stacked tabs w/ CSS grid 👨‍🍳 + works with keyboard navigation + drag gestures + container queries for orientation
0:36

responsive stacked tabs w/ CSS grid 👨‍🍳 + works with keyboard navigation + drag gestures + container queries for orientation

jhey ʕ•ᴥ•ʔ

71,149 görüntüleme • 8 ay önce

Useful keyboard shortcuts
0:56

Useful keyboard shortcuts

Tech Burrito

658,567 görüntüleme • 3 yıl önce

CSS + deviceorientation for responsive angle mode (def not supporting the keyboard 💀)
0:28

CSS + deviceorientation for responsive angle mode (def not supporting the keyboard 💀)

jhey ʕ•ᴥ•ʔ

111,055 görüntüleme • 1 yıl önce

Keyboard Shortcuts Tips in Adobe illustrator
0:40

Keyboard Shortcuts Tips in Adobe illustrator

After Effects Tricks!

54,234 görüntüleme • 11 ay önce

New keyboard canvas controls → Panning: with arrow keys and zoom → Placement: add frames and objects using shortcuts and a guided crosshair view → Selection: navigate, select, and toggle objects with just your keyboard → Screen reader support for keyboard canvas controls
0:31

New keyboard canvas controls → Panning: with arrow keys and zoom → Placement: add frames and objects using shortcuts and a guided crosshair view → Selection: navigate, select, and toggle objects with just your keyboard → Screen reader support for keyboard canvas controls

Figma

72,222 görüntüleme • 10 ay önce

stop duplicating your navigation for mobile 🤙 use the Popover API and some CSS tricks to make it responsive ✅ sidebar on desktop ✅ drawer on mobile ✅ progressively enhance the drag mechanics
0:29

stop duplicating your navigation for mobile 🤙 use the Popover API and some CSS tricks to make it responsive ✅ sidebar on desktop ✅ drawer on mobile ✅ progressively enhance the drag mechanics

jhey ʕ•ᴥ•ʔ

256,187 görüntüleme • 1 yıl önce

neat trick for the sheet effect by transforming the body with CSS when you have :popover-open ✨ :root:has(.drawer:popover-open) body { scale: calc(0.95 + (var(--c) * 0.05)); translate: 0 calc(.875rem * (1 - var(--c)); } [popover] isn't affected as it's in the :top-layer 🚀
0:20

neat trick for the sheet effect by transforming the body with CSS when you have :popover-open ✨ :root:has(.drawer:popover-open) body { scale: calc(0.95 + (var(--c) * 0.05)); translate: 0 calc(.875rem * (1 - var(--c)); } [popover] isn't affected as it's in the :top-layer 🚀

jhey ʕ•ᴥ•ʔ

77,988 görüntüleme • 1 yıl önce

adding the little details™ progressively enhance the overdrag bounce with a sprinkle of JavaScript and some CSS linear() ✨
0:20

adding the little details™ progressively enhance the overdrag bounce with a sprinkle of JavaScript and some CSS linear() ✨

jhey ʕ•ᴥ•ʔ

90,162 görüntüleme • 2 yıl önce

Responsive funny Credit Card form ✨ Using HTML, CSS and JavaScript CodePen link below 👇
0:29

Responsive funny Credit Card form ✨ Using HTML, CSS and JavaScript CodePen link below 👇

Viki ✨

908,828 görüntüleme • 2 yıl önce

Essential Adobe Illustrator Keyboard Shortcuts Collection sc ig/pixelpilot.cc_design
1:31

Essential Adobe Illustrator Keyboard Shortcuts Collection sc ig/pixelpilot.cc_design

Mutia

24,614 görüntüleme • 10 ay önce

I designed and built this simple landing page from scratch using HTML, CSS, and JavaScript. Unto the next chapter REACT 💪
0:41

I designed and built this simple landing page from scratch using HTML, CSS, and JavaScript. Unto the next chapter REACT 💪

Benita Mbulu

14,430 görüntüleme • 6 ay önce

Here are some AI keyboard shortcuts! Learn them now!
0:30

Here are some AI keyboard shortcuts! Learn them now!

After Effects Tricks!

56,672 görüntüleme • 3 ay önce

essential Adobe Illustrator keyboard shortcuts pros use daily (by: ducthangds)
0:40

essential Adobe Illustrator keyboard shortcuts pros use daily (by: ducthangds)

NexGridCo

744,686 görüntüleme • 2 ay önce

You can now use keyboard shortcuts in v0's design mode.
0:20

You can now use keyboard shortcuts in v0's design mode.

v0

11,216 görüntüleme • 6 ay önce

Design a personalised trading workspace with 30+ trading widgets, 30+ keyboard shortcuts, and 7 pre-built layouts.
0:42

Design a personalised trading workspace with 30+ trading widgets, 30+ keyboard shortcuts, and 7 pre-built layouts.

Dhan - Made for Trade

3,106,956 görüntüleme • 1 ay önce

6 keyboard shortcuts that will help you become a pro in Excel
0:39

6 keyboard shortcuts that will help you become a pro in Excel

Today I Learned

115,950 görüntüleme • 4 ay önce

How my games are going... #javascript #HTML #CSS #IndieGameDev #indiegame #indiedev #NodeJS #mysql
2:34

How my games are going... #javascript #HTML #CSS #IndieGameDev #indiegame #indiedev #NodeJS #mysql

Lord Doomer Protector of the Omniverse

27,028 görüntüleme • 1 yıl önce