Jump to content
Search Community

Is there a way of reversing the direction of text when scrolling back up?

Jase test
Moderator Tag

Recommended Posts

Thanks for your response Brian. Yeah not sure how to implement the scrub into my codepen to make this work. Are you able to elaborate with a codepen mockup? I truly appreciate how help you can offer. 

Link to comment
Share on other sites

Really appreciate your efforts but the text is now static when not scrolling horizontally. The text should always be moving slowly in the direction that is dependant on browser scrolling up or down.

Link to comment
Share on other sites

Thanks Mikel, I appreciate the example but it’s not what I’m looking for I don’t think. I was hoping that gsap could help make it easy to scroll up and down with interchanging horizontal text direction. In the example I’m having to click a button to change direction. 

Link to comment
Share on other sites

Ah, so you don't really want it totally linked to the scrollbar. Sure, you can just alter the timeScale of the animation(s) with a single ScrollTrigger. Here's a simple example (forked demo):

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

 

I created that roll() helper function just to make it simple to create a looping animation where it clones the element, puts it right next to it, and makes it look seamless. I animated the timeScale so that the change is smooth rather than suddenly shifting direction. 

 

Is that what you're looking for? 

  • Like 4
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.
×
×
  • Create New...