Transitioning Top-Layer Entries And The Display Property In CSS
February 4, 2025
We are getting spoiled with so many new features involving animations with CSS, from scroll-driven animations to view transitions, and plenty of things in between. But it’s not always the big features that make our everyday lives easier; sometimes, it’s those ease-of-life features that truly enhance our projects. In this article, Brecht De Ruyte puts two features on display: @starting-style and transition-behavior — two properties that are absolutely welcome additions to your everyday work with CSS animations.
Source: Transitioning Top-Layer Entries And The Display Property In CSS — Smashing Magazine
When CSS transitions and animations arrived there was much rejoicing as complicated effects that required JavaScript and had significant performance impacts were now simple to implement in a performant way.
But there were many edge cases, and gotchas, like animating to or from auto values, or display: none. For such cases we again needed to use JavaScript as a workaround.
Now with additions to CSS, we no longer need such workarounds as Brecht De Ruyte explains here.
