gem

I want to animate the background, but it is not continuous with the spaces between words. Is there a way that I can treat spaces as characters, so that they will be animated the same way. Thank you!!! To be as clear as possible I want the background of the spaces to be treated exactly the same as the rest of the characters

So I ended up having to throw the second animation in a setTimeout. This way the animation waits and does not skip the initial fade in. I have a follow-up to this same animation. When scrolling the images almost feel like they are behind, and after the user is done scrolling it takes a second for the pictures to stop moving. I have the scrub set to true, and trying to change the ease effects has not changed anything. A better demo can be seen here, which really shows the images feeling like they are "catching up" to the scroll Thank you!

Just want to circle back to see if there are any additional solutions? Using a fromTo in this situation essentially overwrites the staggered fade in a few functions above. Thanks!

I realize that the image starts very big - I apologize but please ignore this, it is not a bug on my actual site. I have a timeline that animates the elements initially coming into frame. If the user navigates to the page and does not scroll, everything works perfectly. The issue comes if a user scrolls before the animation is done. To replicate this issue: - refresh page - scroll down before timeline is done playing - scroll back up You will notice that many of the images are missing or not the right opacity. I am wondering if there is any way to avoid this happening. Thanks so much. EDIT: realizing that the codepen is not working on this page. If you click edit on codepen it works no problem. Thanks

@Rodrigo This is exactly what I am looking - thank you so much!!

Hello! I have a strange issue with my animation. At the very start of the animation I want the "Hello World" header to stay there the whole time. If you scroll on the faster side, the header ends up going past where it is supposed to stop and then jumps back down to the position that it should be. After the initial time that this happens, it never happens again. If you refresh the page the same thing will happen once and then never again. This is certainly a pretty obscure issue with the animation so any help would be appreciated. Thank you!

Hello! On page load I am trying to create am animation where certain elements fade in. On these same elements I have a scrolltrigger that moves the elements around and animates the opacity to 0. Each animation works without each other, but when trying to run both it does not work. After the initial fade in, once the user scrolls the elements disappear. Any help is greatly appreciated. Thank you!

Thanks Jack! That's exactly what I wanted and is very useful. I also want to ask if there's any way to do the same in between each tween. It feels like the same issue is happening where once a tween has finished, there is a lot of scroll needed to start the next tween. Thanks!

Hello! I have created a timeline with Scrolltrigger. I want to make the animation start sooner. So as soon as the section gets pinned, the animation should start. It feels like after the element gets pinned, I have to scroll too much to get the Scrolltrigger to start (although it does feel worse on the live site). Any help is greatly appreciated. Thank you!!

Hi Cassie, This is amazing. Thank you so much!!!

Hello, the animation is currently working how I want it to, but was wondering if there was a way so that each element on the left would snap to centered. The current way it is working is making it so that it snaps to the start or end of the container. Thanks for the help! Please note - I have just started learning GSAP. If there is a much better way to approach this animation, please let me know. Thanks!!!