In this eighth episode of “Unleash the Power of Scroll-Driven Animations”, show host Bramus shows how to animate external objects such as 3D models, video elements, etc. on scroll. The trick is to use a Scroll-Driven Animation (even a dummy one), read the effect’s progress, and then map its value to the external object. Chapters: 0:00 - Intro 0:38 - Rotating a 3D Model on scroll 1:18 - Effect progress vs Animation progress 1:49 - Rotating a 3D Model on scroll (continued) 2:25 - Advancing a video on scroll 3:03 - Outro Resources: Demo: Rotating 3D Robot → Demo: 3D Shoe Explorer → Demo: Video Scroll Progress → Article: Scroll-Driven Objects → Check out more Scroll-Driven Animations Demos → Watch more Unleash the Power of Scroll-Driven Animations → Subscribe to Chrome for Developers → #CSS #ScrollDrivenAnimations #Animation #Chrome Speaker: Bramus Van Damme
Hide player controls
Hide resume playing