pietM Posted May 1, 2021 Share Posted May 1, 2021 Hi everyone, Having a weird issue with a simple animation with GSAP 3.6.1. When the animation repeats, the timeline breaks and the text blinks, etc. Using the same code (with GSAP 3.5.1), there is no issue. GSAP 3.5.1 version: See the Pen OJWbVEr by evryali (@evryali) on CodePen I don't get the discrepancy. What am I missing? I appreciate any help, as always. GSAP 3.6.1 version: See the Pen wvgLXOq by evryali (@evryali) on CodePen Link to comment Share on other sites More sharing options...
pietM Posted May 1, 2021 Author Share Posted May 1, 2021 Still struggling with this. How can the same code produce different behaviors between the two versions? Thanks for all! M Link to comment Share on other sites More sharing options...
GreenSock Posted May 2, 2021 Share Posted May 2, 2021 Hi @pietM. Yes, there was a regression in 3.6.1 that caused this, and it should be resolved in the next release which you can preview at https://assets.codepen.io/16327/gsap-latest-beta.min.js Better? Your demo seemed odd to me, though - you've got an extra .to() tween that's animating the characters opacity to 1 even though they're already at 1 at that time. I'm curious why you were doing that. If I understand correctly, deleting that part of tl2 resolves the issue as well. 1 Link to comment Share on other sites More sharing options...
pietM Posted May 2, 2021 Author Share Posted May 2, 2021 THANK YOU, Jack! Yes, the beta .js resolves the issue. Phew! As for the extra .to(), it's a very inelegant way to hold the characters at 1 opacity for whatever interval before transitioning out. For me, it makes sense to partition the before/after states into two timelines. Though, I'm sure there is a better, more efficient way to achieve this. Again, thanks for getting back. I really appreciate GSAP and its community. Link to comment Share on other sites More sharing options...
GreenSock Posted May 3, 2021 Share Posted May 3, 2021 17 hours ago, pietM said: As for the extra .to(), it's a very inelegant way to hold the characters at 1 opacity for whatever interval before transitioning out. For me, it makes sense to partition the before/after states into two timelines. Though, I'm sure there is a better, more efficient way to achieve this. Yeah, you could eliminate that altogether. Just use the position parameter to place the fade-out tween later in the timeline. Your way isn't "wrong" - it's just a bit wasteful and verbose Glad the beta is working well for you. Happy tweening! 1 Link to comment Share on other sites More sharing options...
pietM Posted May 3, 2021 Author Share Posted May 3, 2021 Thanks, Jack. I removed the second timeline altogether, as you suggest. The code is much leaner now and functions perfectly. I will definitely adopt this approach moving forward. tl1.to(chars, { opacity: 0, duration:1, delay:1, ease: "expo.inOut", },2) Thanks again for taking the time to help out. All best, M 1 Link to comment Share on other sites More sharing options...
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