iotron Posted May 14, 2022 Share Posted May 14, 2022 Hi, I am new to GSAP and animation. I have tried to create this animation to cycle words from an array. But the animation came out to be somewhat stiff cause I am a noob. 😅 How can I make the animation a bit smoother, like make the letters slide down like a casino while scrambling. Also, the word is not revealing letter by letter as was in the scramble text demo. Kindly help. Thank you. See the Pen oNEYWxz by iotronlab (@iotronlab) on CodePen Link to comment Share on other sites More sharing options...
Solution GreenSock Posted May 14, 2022 Solution Share Posted May 14, 2022 You had the "duration" tucked inside the scrambleText: {...} object, so it defaulted to using a duration of 0.5 yet you also had the revealDelay set to 0.5 (the same), thus by the time it started the reveal, the tween was over. I assume you wanted it to be more like this?: See the Pen zYRozmR?editors=0010 by GreenSock (@GreenSock) on CodePen 2 Link to comment Share on other sites More sharing options...
iotron Posted May 14, 2022 Author Share Posted May 14, 2022 Hi, thanks for the help. Much appreciated. How can we add transition animation to the letters like slide-in-y? Link to comment Share on other sites More sharing options...
Cassie Posted May 14, 2022 Share Posted May 14, 2022 You'll need SplitText for customised text animations - scrambleText is just for scrambling. ☺️ 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