In today's GUI Challenge, @AdamArgyleInk puts a #CSS spin on a classic sci-fi movie 3D text effect by making it interactive to scroll. Powered by CSS scroll linked animations as specified by the latest Scroll Animations 1 spec, watch as he scrolls some text and makes it vanish into the edges of the galaxy, or um, the viewport.
Chapters:
- 0:00 - Introduction
- 0:29 - Intro
- 1:00 - Story time
- 2:20 - Scroll Driven Animation
- 3:21 - HTML
- 4:00 - CSS
- 8:58 - Debugging
- 10:52 - Outro
Resources:
- Try a demo → https://goo.gle/410acMc
- Get the source → https://goo.gle/408Nkc1
- Check the spec → https://goo.gle/3pvWX49
Watch more GUI Challenges → https://goo.gle/GUIchallenges
Subscribe to Google Chrome Developers → https://goo.gle/ChromeDevs