正在加载视频...

视频加载失败

加载此视频时出现问题。这可能是由于临时网络问题，或视频可能不可用。

You can make elements smoothly animate between pages with just two lines of CSS. No JavaScript needed. Here's how 👇

Victor

36,592 subscribers

22,216 次观看 • 3 个月前 •via X (Twitter)

Anya Rossi• Live Now

Private livecam show

0 条评论

暂无评论

原始帖子的评论将显示在这里

相关视频

Make your UI smarter with scroll-state()! → With CSS scroll-state() queries, you can easily manage stuck, snapped, and overflowing elements.

Make your UI smarter with scroll-state()! → With CSS scroll-state() queries, you can easily manage stuck, snapped, and overflowing elements.

Chrome for Developers

61,126 次观看 • 1 年前

pretty incredible what you can do with a few dozen lines of CSS nowadays

pretty incredible what you can do with a few dozen lines of CSS nowadays

scalar

12,772 次观看 • 5 个月前

LOOK. This is just a regular ol' website. No JavaScript whatsoever. Navigation pages with clicks <a> links to other HTML pages. The most basic website in the world. Yet, with a few lines of code to activate View Transitions, KAPOW.

LOOK. This is just a regular ol' website. No JavaScript whatsoever. Navigation pages with clicks <a> links to other HTML pages. The most basic website in the world. Yet, with a few lines of code to activate View Transitions, KAPOW.

Chris Coyier

830,501 次观看 • 3 年前

🎮 New CSS Game! What about a CSS game that you can play with your keyboard? No, it's not a joke but a reality! Play "Super CSS Mario", the first CSS-Only game playable using your keyboard. CodePen.IO demo in the next tweet 👇 0% JavaScript - 100% CSS Magic! Have fun🤩

🎮 New CSS Game! What about a CSS game that you can play with your keyboard? No, it's not a joke but a reality! Play "Super CSS Mario", the first CSS-Only game playable using your keyboard. CodePen.IO demo in the next tweet 👇 0% JavaScript - 100% CSS Magic! Have fun🤩

CSS by T. Afif

13,762 次观看 • 2 年前

With a few lines of CSS, you can send your loved one this heartbeat animation on Valentine's. 💜 Live preview

With a few lines of CSS, you can send your loved one this heartbeat animation on Valentine's. 💜 Live preview

Florin Pop 👨🏻‍💻

79,394 次观看 • 3 年前

hear me out you don’t need js to create a marquee animation just a couple of lines of css and duplicated children with `aria-hidden`

hear me out you don’t need js to create a marquee animation just a couple of lines of css and duplicated children with `aria-hidden`

dmytro

160,361 次观看 • 1 年前

🔌Here you can see how Hynergy’s cables behave when placing them, with different colors to separate lines and elements that make redistribution easier. Follow Hynergy, a Hytale mod about energy and automation. #Hytale #mod #Blockbench

🔌Here you can see how Hynergy’s cables behave when placing them, with different colors to separate lines and elements that make redistribution easier. Follow Hynergy, a Hytale mod about energy and automation. #Hytale #mod #Blockbench

Seyager (Hynergy)

110,827 次观看 • 7 个月前

Unlock the power of JavaScript. With "JavaScript for Web Wizards"📕 ◈ Guides And Framework ◈ 70+ Theoretical Questions. ◈ 50+ JavaScript Exercises. ◈ Rapid Revision Grab it for FREE. Drop a 👋🏼 in the comments, Make sure you follow me, So that can DM You.

Unlock the power of JavaScript. With "JavaScript for Web Wizards"📕 ◈ Guides And Framework ◈ 70+ Theoretical Questions. ◈ 50+ JavaScript Exercises. ◈ Rapid Revision Grab it for FREE. Drop a 👋🏼 in the comments, Make sure you follow me, So that can DM You.

Mohd Rizwan Alam

28,619 次观看 • 2 年前

UI && CSS Tip! 🚀 You can use View Transitions to create that Radix by WorkOS style theme switcher 👀 ::view-transition-new(root) { animation: reveal;} keyframes reveal { 0% { clip-path: polygon(...);} /* Code 👇 */ } Animate clip-path between modes 😍 CodePen.IO link below! 👇

UI && CSS Tip! 🚀 You can use View Transitions to create that Radix by WorkOS style theme switcher 👀 ::view-transition-new(root) { animation: reveal;} keyframes reveal { 0% { clip-path: polygon(...);} /* Code 👇 */ } Animate clip-path between modes 😍 CodePen.IO link below! 👇

jhey ʕ•ᴥ•ʔ

232,919 次观看 • 3 年前

Here's how you can make your photos more festive with Nano Banana in Google Photos. 📷🎄

Here's how you can make your photos more festive with Nano Banana in Google Photos. 📷🎄

Google

46,531 次观看 • 8 个月前

you can create a CSS only carousel with CSS `𝚜𝚌𝚛𝚘𝚕𝚕-𝚜𝚗𝚊𝚙` .𝚜𝚌𝚛𝚘𝚕𝚕𝚎𝚛 { 𝚘𝚟𝚎𝚛𝚏𝚕𝚘𝚠-𝚡: 𝚊𝚞𝚝𝚘; 𝚜𝚌𝚛𝚘𝚕𝚕-𝚜𝚗𝚊𝚙-𝚝𝚢𝚙𝚎: 𝚡 𝚖𝚊𝚗𝚍𝚊𝚝𝚘𝚛𝚢; 𝚜𝚌𝚛𝚘𝚕𝚕-𝚙𝚊𝚍𝚍𝚒𝚗𝚐-𝚒𝚗𝚕𝚒𝚗𝚎: 𝟷.𝟻𝚛𝚎𝚖; /* 𝚖𝚊𝚝𝚌𝚑𝚎𝚜 𝚢𝚘𝚞𝚛 𝚜𝚌𝚛𝚘𝚕𝚕-𝚙𝚕/𝚙𝚛 */ } .𝚌𝚊𝚛𝚍 { 𝚜𝚌𝚛𝚘𝚕𝚕-𝚜𝚗𝚊𝚙-𝚊𝚕𝚒𝚐𝚗: 𝚌𝚎𝚗𝚝𝚎𝚛; 𝚏𝚕𝚎𝚡-𝚜𝚑𝚛𝚒𝚗𝚔: 𝟶; } When you scroll, it snaps exactly in the center of the card Super fun to use, easy to implement, no javascript required

you can create a CSS only carousel with CSS `𝚜𝚌𝚛𝚘𝚕𝚕-𝚜𝚗𝚊𝚙` .𝚜𝚌𝚛𝚘𝚕𝚕𝚎𝚛 { 𝚘𝚟𝚎𝚛𝚏𝚕𝚘𝚠-𝚡: 𝚊𝚞𝚝𝚘; 𝚜𝚌𝚛𝚘𝚕𝚕-𝚜𝚗𝚊𝚙-𝚝𝚢𝚙𝚎: 𝚡 𝚖𝚊𝚗𝚍𝚊𝚝𝚘𝚛𝚢; 𝚜𝚌𝚛𝚘𝚕𝚕-𝚙𝚊𝚍𝚍𝚒𝚗𝚐-𝚒𝚗𝚕𝚒𝚗𝚎: 𝟷.𝟻𝚛𝚎𝚖; /* 𝚖𝚊𝚝𝚌𝚑𝚎𝚜 𝚢𝚘𝚞𝚛 𝚜𝚌𝚛𝚘𝚕𝚕-𝚙𝚕/𝚙𝚛 */ } .𝚌𝚊𝚛𝚍 { 𝚜𝚌𝚛𝚘𝚕𝚕-𝚜𝚗𝚊𝚙-𝚊𝚕𝚒𝚐𝚗: 𝚌𝚎𝚗𝚝𝚎𝚛; 𝚏𝚕𝚎𝚡-𝚜𝚑𝚛𝚒𝚗𝚔: 𝟶; } When you scroll, it snaps exactly in the center of the card Super fun to use, easy to implement, no javascript required

Manu Arora

56,313 次观看 • 4 个月前

can you still tell what’s real? not anymore. HeyGen just dropped Avatar IV, it can make anyone talk anything with human like expression and movement the lines between real and AI is gone step by step tutorial:

el.cine

289,758 次观看 • 1 年前

*You can make popup modals with 2 lines of HTML* Yesterday, Firefox 🔥 125 came out. This means all major browsers now support all the fantastic features of popover, which means an entire class of JavaScript libraries (and I suspect about 10% of @GitHub) is now fully obsolete.

You can make popup modals with 2 lines of HTML Yesterday, Firefox 🔥 125 came out. This means all major browsers now support all the fantastic features of popover, which means an entire class of JavaScript libraries (and I suspect about 10% of @GitHub) is now fully obsolete.

Joost de Valk

221,111 次观看 • 2 年前

You can make mocks of a video game you're designing with JSON + Veo3 Here's my First Person View "Catpetter" game 😹 JSON prompt + instructions 👇

You can make mocks of a video game you're designing with JSON + Veo3 Here's my First Person View "Catpetter" game 😹 JSON prompt + instructions 👇

Kris Kashtanova

89,269 次观看 • 1 年前

RIP Photoshop. Higgsfield just launched Canvas, a state-of-the-art image editing model. With just two clicks, you can swap any object in an image. Logos, text, texture and scale stay exactly as they are... Here's how it works:

RIP Photoshop. Higgsfield just launched Canvas, a state-of-the-art image editing model. With just two clicks, you can swap any object in an image. Logos, text, texture and scale stay exactly as they are... Here's how it works:

Angry Tom

156,252 次观看 • 1 年前