Jump to content


[Help] opacity issue when using ScrollTrigger

Recommended Posts

B1: first load logo, opacity 0 -> 1

B2: scroll down opacity inscrease 0 -> 1, scroll up opacity return 1


But when i scroll down, logo element was opacity = 0, can you help me?

See the Pen QWmKQby by theflash8888 (@theflash8888) on CodePen

Link to comment
Share on other sites

Hello GreenSock, can you help me, please, close this topic, issue was fixed!

Thank you so much!

Link to comment
Share on other sites

Hello GreenSock


Why i can not delete this topic ?

I can not find delete button 😢

Link to comment
Share on other sites

I noticed a few problems

  • You set the trigger to an element that doesn't exist.
  • You nested a ScrollTrigger in a child tween of a timeline - never do that because it's logically impossible to have BOTH the timeline control the playhead AND the scrollbar position simultaneously. 
  • You were trying to have the ScrollTrigger-based tween use the final opacity AFTER a totally different tween finishes running. But by default, ScrollTrigger-based animations render immediately, thus in this case it was locking in the opacity: 0 (starting value) which you were then changing with a different tween. You can set immediateRender: false to avoid that. 

Is this more like what you wanted?:

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


As for deleting the topic, don't worry about that - it can be nice to keep around so that others can learn from it too. Glad you solved it. 

  • Thanks 1
Link to comment
Share on other sites

Hello GreenSock,


That amazing, thank you for your explain, I will keep it(set immediateRender: false) on your mind.

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.