ScrollTrigger animation

[rala]

Hi, why the animation when I add the scroll Trigger become not smooth and every item in the row  appears suddenly 

See the Pen wvqQWgQ by roleno (@roleno) on CodePen

[Cassie]

Hey @rala,

Did you maybe mean for the animation to be triggered as the user enters that section - rather than scrubbed through?

See the Pen JjyxJqb by GreenSock (@GreenSock) on CodePen

[rala]

yes I think so , but may I ask you what the scrub exactly do ?

I have another question please when I have multiple items in the same section and I want to animate them one after another when the section appears in the viewport for the user before I add the scroll Trigger to the timeline I did this by add label to the timeline but after I add the scroll Trigger all the items appears at the same time (note: the items not have the same CSS class or the same animation)

and thank you so much for the quick answer 

[Cassie]

Sure thing!

scrub ties the animation to the scroll progress - if you add it scrub:true back in and scroll slowly up and down you'll notice it 'scrubbing' through the animation.

 

scrub

Boolean | Number - Links the progress of the animation directly to the scrollbar so it acts like a scrubber. You can apply smoothing so that it takes a little time for the playhead to catch up with the scrollbar's position! It can be any of the following Boolean - scrub: true links the animation's progress directly to the ScrollTrigger's progress. Number - The amount of time (in seconds) that the playhead should take to "catch up", so scrub: 0.5 would cause the animation's playhead to take 0.5 seconds to catch up with the scrollbar's position. It's great for smoothing things out.

As for your next question it sounds like you want to be doing a loop of some sort. Maybe like this?
 

If this isn't helpful could you make a demo so I can see? ✨