isaac19197

@mvaneijgen Thank you so much for the reply I am truly amazed by the speed. After reading, the part that stood out to me was, "It can be fairly difficult to target the same element with different tweens and have them fight for control." This is exactly what I was looking for which made me feel better it was not my fault, and I have to restructure the way I am using gsap to stack animations. The solution was simple. Don't chain onto a single element, rather house the text in a container and apply the scale to the container versus both on the text. I appreciate you telling me about "from" however, I was using "fromTo" to kinda debug if the endpoint needed to be defined before stacking animations... which has been proven false!

Hi there, I forgot to mention, "mainText" and "downArrow" are both variables, but are just regular text.

Hi there, I am trying to achieve a scroll trigger on scale after already using scale in a fromTo statment. There seems to be an issue with doing this, or maybe I am misunderstanding how to use GSAP which is probably the case. I also cannot start the scrollTrigger scale at 1.0... it has to be 1.2 and I don't know why. If someone could please take the time to help me out that would be fantastic! const section1Animations = gsap.timeline(); section1Animations .fromTo(mainText, { opacity: 0, scale: 0.5, }, { scale: 1.0, opacity: 1.0, duration: 1 }) .fromTo(downArrow, { opacity: 0, y: 100 }, { opacity: 1, y: 0, duration: 1 }) //To animate the scale after the above timeline fires. gsap.to(mainText, { scrollTrigger: { trigger: section1, start: "top bottom", end: "bottom top", scrub: 1 }, scale: 1.2, transformOrigin: "bottom", })