CSS variable scoping when using animation
Watching Kevin's video (https://www.youtube.com/watch?v=Qj0Qx8HpNUo) on parallax had me wondering at 8:22. He goes ahead and uses the --parallax-speed variable, which is declared privately/locally in each of the .parallax's children. Each .parallex child also has an animation declared, which makes use of the @keyframes parallax animation. How does the @keyframes parallax animation scope have access to the --parallax-speed variable of every child?
YouTubeKevin Powell
https://kevinpowell.co/courses?utm_campaign=general&utm_source=youtube&utm_medium=cssparallax 
Interested in levelling up your CSS game? I’ve got courses!
Parallax effects can be cool, but I’m always told the CSS-only solutions aren’t “true” parallax. Well, thanks to scroll-timeline: scroll(), we can now create true parallax effects without on...
Interested in levelling up your CSS game? I’ve got courses!Parallax effects can be cool, but I’m always told the CSS-only solutions aren’t “true” parallax. Well, thanks to scroll-timeline: scroll(), we can now create true parallax effects without on...
A friendly place for developers to meet other devs, ask questions, get help, and just have a good time 🙂.
36,263Members
Resources
Similar Threads
Was this page helpful?
