Animate display: none (and more!) with View Transitions
Channel: Chrome for Developers
Date: 2023-06-14

Write any CSS you want in the contenteditable -pre- and some JavaScript will tell the browser to start a view transition (take a before screenshot), apply the written styles to the page, then take an after screenshot and transition between the two states (whatever they are!).

Codepen demo → https://goo.gle/3Ps3hZx 
View Transitions guide → https://goo.gle/3CqDHMB 

GUI Snippets → https://goo.gle/GUIsnippets  
GUI Challenges → https://goo.gle/GUIchallenges 

Subscribe to Google Chrome Developers → https://goo.gle/ChromeDevs 

#GUIsnippets