Video yükleniyor...

Video Yüklenemedi

Ana Sayfaya Dön

Experimental #CSS carousel ✅ subgrid ✅ scroll driven animations (SDA) ✅ oklch() ✅ property ✅ Layer *Lots of code comments* to help break down the effects 🤓 ✅ SDA changes hue/theme ✅ SDA toggles next/prev ✅ SDA syncs dots

84,455 görüntüleme • 3 yıl önce •via X (Twitter)

10 Yorum

Adam Argyle profil fotoğrafı
Adam Argyle3 yıl önce

art by @pablostanley and their new rad Transhumans pack

Adam Argyle profil fotoğrafı
Adam Argyle3 yıl önce

look at all the JS running things! 😏 jk, there are 2 lines of JS required in this carousel: the next and previous buttons `window.scrollBy(-100, 0)` and `window.scrollBy(100, 0)` otherwise CSS is keeping everything synced and animated 🤓

Sudhansu Bhushan Mishra profil fotoğrafı
Sudhansu Bhushan Mishra3 yıl önce

@property @layer Actually this is so exciting to imagine all the possibilities now with all things new in 2023

Marcin Pietrzak profil fotoğrafı
Marcin Pietrzak3 yıl önce

@property @layer Seriously impressive! The subgrid and scroll driven animations... And oklch() sounds are a neat addition too.

Nicolas Jesenberger profil fotoğrafı
Nicolas Jesenberger3 yıl önce

@layer Nice! Gotta play with scroll-driven animation some day

a man profil fotoğrafı
a man3 yıl önce

@bramus @property @layer You frequently talk about the future of CSS and provide CodePen links. However, when I click on those links, they never seem to work. Could you please include versions for various desktop browsers? I'm unable to view your work as I'm unsure how to replicate the version.

Adam Argyle profil fotoğrafı
Adam Argyle3 yıl önce

@bramus @property @layer When in doubt use Canary with the web experiments on in about://flags 👍🏻 I'll try and be better about specifying how to replicate the video in a thread with the tweet, sometimes I forget or assume A prompt made it into my website post 😅

Hugo Nogueira profil fotoğrafı
Hugo Nogueira3 yıl önce

@property @layer You maniac!! ❤️

Shaun Levett profil fotoğrafı
Shaun Levett3 yıl önce

@property @layer I’d love to use scroll snap for stuff instead of a carousel plug-in, but most PC mice don’t have a side scroll like a mac mouse etc, so the use expertience suffers. Until we get pagination and arrows with it it’s hard to use on PC.

ed profil fotoğrafı
ed3 yıl önce

@property @layer Works nicely, except in Safari (dev betas). Swiping/scrollind sideways is pretty good :)

Benzer Videolar

MUDANG: Two Hearts 🚀 🎞️Genre: ✅Narrative-driven ✅3rd person action adventure ✅Cinematic storytelling ✅Immersive stealth 📖Story: ✅Set in a volatile Korean Peninsula ✅North/South Korea about to unify ✅Play as two characters ✅K-Pop idol named GAVI ✅Ji Jeongtae North Korean special forces ✅Paths merge in an unsettling truth 🎭Design: ✅State of the art performance capture ✅Fluid motion-matched animations ✅Open ended level design ✅Dynamic spatial audio ✅Combat flexibility ✅Choose stealth, CQC or all-our gunplay ✅Unmatched realism ✅Cutscenes crafted for immersion ✅No cuts or loading screens ✅Seamless story and gameplay transition 🕹️Gameplay: ✅Dynamic combat ✅Many tactics inspired by real strategies ✅Multiple routes and vantage points ✅Hide in the shadows ✅Hang from pipes ✅Slip through vents ✅Climb buildings ✅Destroy parts of the environment ✅Set up ambushes ✅Environmental takedowns ✅Variety of CQC moves ✅Lethal and nonlethal ✅Goggles, EMPs, grenades, lures & mines ✅Deep firearms arsenal ✅Enemy AI built from the ground up ✅Dynamically adapts to player actions ✅Enemies w/same capabilities/gadgets ✅Formidable bosses w/unique powers 💿Development: ✅Formerly codenamed “Project TH” ✅In development for ~7 years ✅Coming to PS5, Xbox and PC ✅Launching in 2026 ✅Developer: MUDANG(Project TH) Play or pass? 😎 Watch gameplay evolution footage between early development and the latest trailer⬇️

Rino🚀

49,960 görüntüleme • 1 yıl önce

MUDANG: Two Hearts 🚀 🎞️Genre: ✅Narrative-driven ✅3rd person action adventure ✅Cinematic storytelling ✅Immersive stealth 📖Story: ✅Set in a volatile Korean Peninsula ✅North/South Korea about to unify ✅Play as two characters ✅K-Pop idol named GAVI ✅Ji Jeongtae North Korean special forces ✅Paths merge in an unsettling truth 🎭Design: ✅State of the art performance capture ✅Fluid motion-matched animations ✅Open ended level design ✅Dynamic spatial audio ✅Combat flexibility ✅Choose stealth, CQC or all-our gunplay ✅Unmatched realism ✅Cutscenes crafted for immersion ✅No cuts or loading screens ✅Seamless story and gameplay transition 🕹️Gameplay: ✅Dynamic combat ✅Many tactics inspired by real strategies ✅Multiple routes and vantage points ✅Hide in the shadows ✅Hang from pipes ✅Slip through vents ✅Climb buildings ✅Destroy parts of the environment ✅Set up ambushes ✅Environmental takedowns ✅Variety of CQC moves ✅Lethal and nonlethal ✅Goggles, EMPs, grenades, lures & mines ✅Deep firearms arsenal ✅Enemy AI built from the ground up ✅Dynamically adapts to player actions ✅Enemies w/same capabilities/gadgets ✅Formidable bosses w/unique powers 💿Development: ✅Formerly codenamed “Project TH” ✅In development for ~7 years ✅Coming to PS5, Xbox and PC ✅Launching in 2026 ✅Developer: @TH_EVRSTUDIO Play or pass? 😎 Watch gameplay evolution footage between early development and the latest trailer⬇️

Rino

69,134 görüntüleme • 1 yıl önce