with tags: #Scroll Driven Animations #Future CSS #CSS Variables #Experiment #Practical #CSS
In my fourth article about scroll-driven animations, I explore how we can transfer the state of one element to a completely different place on a page by connecting them with a unique identifier in CSS via a timeline-scope.
with tags: #Scroll Driven Animations #Future CSS #CSS Variables #Experiment #Practical #CSS
After solving the fit-to-width text, stuck state for sticky elements, and scroll shadows, I wondered: how many other items from various CSS wishlists could I solve with scroll-driven animations? A lot. Styling flex and grid rows and columns, staggered animations, wrap detection, and more — all in my new article.
with tags: #Scroll Driven Animations #Future CSS #Experiment #Typography #Practical #CSS
What if I will tell you how we could solve fit-to-width text with pure CSS without any hardcoded parameters? Curiously, scroll-driven animations will allow us to do just that! Join me as I continue exploring the experimental implementations of the latest specs.
with tags: #Scroll Driven Animations #Position Sticky #Future CSS #Experiment #CSS
Stuck state for sticky headers? “Proper” solution for scrolling shadows? Highlighting the currently shown sections in a Table of Contents? All these things could become possible with the new scroll-driven animations spec. Today, I gather and explain some of my experiments with this new CSS feature.