VSBL Posted August 18, 2020 Share Posted August 18, 2020 Hello everyone, May I ask for help. I have this splitText animation, but would love to have X and OPACITY animation to be with different duration. e.g OPACITY to be 1.5s but X to be 1s. E.G. like with transitions See the Pen QWNEowJ by styuit (@styuit) on CodePen Is there is any way to achieve multiple animations for same char? Thank you! See the Pen poybGqQ by styuit (@styuit) on CodePen Link to comment Share on other sites More sharing options...
ZachSaucier Posted August 18, 2020 Share Posted August 18, 2020 Hey VSBL and welcome to the GreenSock forums. Thanks for supporting GreenSock by being a Club GreenSock member! 6 minutes ago, VSBL said: Is there is any way to achieve multiple animations for same char? Sure, just use two tweens See the Pen mdPEoWX?editors=0010 by GreenSock (@GreenSock) on CodePen 2 Link to comment Share on other sites More sharing options...
PointC Posted August 18, 2020 Share Posted August 18, 2020 Hi @VSBL Welcome to the forum and thanks for joining Club GreenSock. You can use separate tweens for the two properties and then use the position parameter to start them at the same time. tl.from(mySplit.chars, { x: 45, duration: 1, stagger: 0.05 }); tl.from(mySplit.chars, { opacity: 0, duration: 1.5, stagger: 0.05 }, 0); Is that what you meant? Happy tweening. 3 Link to comment Share on other sites More sharing options...
PointC Posted August 18, 2020 Share Posted August 18, 2020 Gotta get some caffeine so I can type faster than Zach. ☕ 2 Link to comment Share on other sites More sharing options...
VSBL Posted August 18, 2020 Author Share Posted August 18, 2020 So simple. Tried to overthink Thank you both! 2 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