vaksy Posted August 31, 2024 Posted August 31, 2024 Hello, I have a problem with ScrollTrigger. I want to achieve a similar effect to what you see on this page: Julian Fella in the section where the text "I HELPED COMPANIES GENERATE" appears. Currently, my container is pinned at the bottom, and the animation starts too early. I’m unsure how to delay it. Could you help me with this issue? See the Pen bGPxxLj by Wiktor-Duda (@Wiktor-Duda) on CodePen.
mvaneijgen Posted September 1, 2024 Posted September 1, 2024 Hi @vaksy welcome to the forum! First of you should be splitting the element that contains the text, in your cause that is #teskst not .titleBurrowing. Also there was a lot of code that didn't seem to do anything in this demo, it is best to start a demo with just the relevant parts, so that it is easier for everyone to see what is going on. Due to you not splitting the correct element, there were no .linia being created, now it works and I've given your .linia class an overflow: hidden; so that the text clips like in the example. I would focus on the ScrollTrigger start and end triggers and play with them to have the animations come in when you think it looks good and then have another ScrollTrigger pin the whole section when it is fully in view. I’ve placed some comments in your JS to better explain things, please be sure to read through them! Hope it helps and happy tweening! See the Pen gONdqQJ?editors=1010 by mvaneijgen (@mvaneijgen) on CodePen. 1 1
vaksy Posted September 4, 2024 Author Posted September 4, 2024 Hello, I simplified the code to make everything more readable, now I stopped at the text at the bottom, the animation on which it is based has two texts that will appear as part of scrolling, how to achieve this effect? See the Pen oNrPRXe by Wiktor-Duda (@Wiktor-Duda) on CodePen.
Rodrigo Posted September 4, 2024 Posted September 4, 2024 Hi, Maybe something like this: See the Pen dyBQdGN by GreenSock (@GreenSock) on CodePen. Hopefully this helps Happy Tweening!
Recommended Posts
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 accountSign in
Already have an account? Sign in here.
Sign In Now