Jump to content


GSAP3 ScrollTrigger - Scrub Enabled - Move element up and then down

Moderator Tag
Go to solution Solved by GreenSock,

Recommended Posts

Hi Guys.


I am new to GSAP, GSAP3 and scrollTrigger.

I have been trying to implement some of the basics to learn how to use GSAP and ScrollTrigger.


Please refer to the codePen.


I am trying to make the letters (YEAH) in the first horizontal sliding section move up then down then up then down through the "scrubbed" animation.

In other words, how do I make them go up and down multiple times instead of just the once.


I have looked for examples and have been unable to find anything doing this.


Can it be done?

See the Pen yLEmJor by kubik101 (@kubik101) on CodePen

Link to comment
Share on other sites

Hi @kubik101 and welcome to the GreenSock forums!


Please take a look at this thread to see how a similar situation it was approached:




Hopefully that's enough to get you started. Let us know if you have more questions.


Happy Tweening!

Link to comment
Share on other sites

  • Solution

Welcome aboard, @kubik101


You could actually use a function-based value to simplify things so that you don't need one animation for the even ones, and another for the odd ones: 

See the Pen MWXNjEj?editors=0010 by GreenSock (@GreenSock) on CodePen


And you just set a repeat value to whatever you want (I chose 3, so it'll play once and then repeat 3 times) and set yoyo: true to make it invert on every repeat. 


Does that clear things up? 

Link to comment
Share on other sites

Hi GreenSock.


Thank you for your solution.

So simple in the end.


While I have you, if you're able and willing, an extended question which I have posted here:



Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.