From the course: CSS: Scrolling and Parallax

Unlock this course with a free trial

Join today to access over 22,600 courses taught by industry experts.

Controlling animations with scroll

Controlling animations with scroll - CSS Tutorial

From the course: CSS: Scrolling and Parallax

Start my 1-month free trial Buy for my team

Controlling animations with scroll

“

- (Narrator) Right now our animation isn't controlled by our Scrolling. As soon as this trigger right here passes the starting area, you'll see that the animation place according to what we specified right here, if we want this to be able to be controlled by our Scroll, we'll need to make some modifications right here. Now first, we need to add a duration parameter to our scene. Let's go ahead and do that we'll add a duration. And then we'll just specify a number of pixels. Let's just type in 300 right now. And you'll see that now instead of it just playing the animation at the beginning, there is a start and an end field and the animation plays as I scroll up and down towards this ending position, which is fine except that, we've got a couple of things that are controlling that a little bit further, because we have a very specific ease right here. This elastic in and out, that is affecting how our animation is playing. So…

Contents