Slides of my lightning talk on CSS @scope
Tag Archives: css
Scoped styling with CSS
Solved by CSS Scroll-Driven Animations: Style an element based on the active Scroll Direction and Scroll Speed
Combine Scroll-Driven Animations with @property, transition-delay, calc(), sign() and abs() … and you can do Scroll Detection using only CSS!
What’s new in CSS? (2023.10.12 @ Frontmania)
The Future of CSS: Easy Light-Dark Mode Color Switching with light-dark()
A function that computes to the first color if the used color scheme is light or unknown, or to the second color if the used color scheme is dark.
LearnWithJason: CSS-Only Scroll-Driven Animations
I was a guest on Jason Lengstorf’s “Learn With Jason” stream. We talked about Scroll-Driven Animations.
Run a Scroll-Driven Animation only once
Animate between states with the View Transition API (2023.09.27 @ devs.gent)
Solved by CSS Scroll-Driven Animations: Detect if an element can scroll or not
Leverage Scroll-Driven Animations + a Space Toggle or State Query to selectively style an element based on it being scrollable or not.
Scroll-Driven Animations Debugger (DevTools Extension)
CSS @property improvements in Chrome DevTools (Chrome 118)
Chrome DevTools included with Chrome 118 has some nice improvements to working with @property.