Worlds Collide: Keyframe Collision Detection Using Style Queries

Interactive CSS animations with elements ricocheting off each other seem more plausible in 2025. While it’s unnecessary to implement Pong in CSS, the increasing flexibility and power of CSS reinforce Lee's suspicion that one day it will be a lifestyle choice whether to achieve any given effect with scripting or CSS.


Worlds Collide: Keyframe Collision Detection Using Style Queries originally published on CSS-Tricks, which is part of the DigitalOcean family. You should get the newsletter.

https://css-tricks.com/worlds-collide-keyframe-collision-detection-using-style-queries/

Creato 2mo | 31 mar 2025, 16:40:08


Accedi per aggiungere un commento

Altri post in questo gruppo

HTML Email Accessibility Report 2025

Some weekend reading on the heels of Global Accessibility Awareness Day (GAADM), which took place yesterday. The Email Markup Con

16 mag 2025, 16:10:17 | CSS tricks
Scroll-Driven Animations Inside a CSS Carousel

Hey, isn't there a fairly new CSS feature that works with scroll regions? Oh yes, that's Scroll-Driven Animations. Shouldn't that mean we can trigger an animation while scrolling through the items

15 mag 2025, 14:40:06 | CSS tricks
This Isn’t Supposed to Happen: Troubleshooting the Impossible

What it looks like to troubleshoot one of those impossible issues that turns out to be something totally else you never thought of.


14 mag 2025, 15:30:09 | CSS tricks
Using Pages CMS for Static Site Content Management

I know, I know: there are a ton of content management system options available, and while I've tested several, none have really been the one, y'know? Weird pricing models, difficult customization,

12 mag 2025, 14:40:32 | CSS tricks
Orbital Mechanics (or How I Optimized a CSS Keyframes Animation)

What does it look like to refactor your own code? John Rhea picks apart an old CSS animation he wrote and walks through the thought process of optimizing it.


8 mag 2025, 13:30:08 | CSS tricks
Why is Nobody Using the hwb() Color Function?

Okay, nobody is an exaggeration, but have you seen the stats for hwb()? They show a steep decline, and after working a lot on color in the CSS-Tricks almanac, I’ve just been wondering

7 mag 2025, 14:10:09 | CSS tricks
GSAP is Now Completely Free, Even for Commercial Use!

Along with the version 3.13 release, GSAP, and all its awesome plugins, are now freely available to everyone.


6 mag 2025, 14:50:06 | CSS tricks