Tr0xi Posted May 23, 2021 Share Posted May 23, 2021 Hey, I'm trying to create an typewriter animation with TextPlugin that writes from the end of the string to the start. So imagine we have a string "Hi i am a string". The animation would write it from right to left in order "gnirts a ma i iH", but it would still be in the proper orientation for reading "Hi i am a string". If you look at the attached codepen. I was able to have it appear from right to left, but the order of the "writing" is wrong in regards of the cursor movement. So is there an way to do it with TextPlugin or do i maybe have to use the SplitText? See the Pen GRWWYbL by Tr0xi (@Tr0xi) on CodePen Link to comment Share on other sites More sharing options...
Cassie Posted May 23, 2021 Share Posted May 23, 2021 From a cursory check of the docs it looks like SplitText is going to be the way to go! 1 Link to comment Share on other sites More sharing options...
elegantseagulls Posted May 23, 2021 Share Posted May 23, 2021 You'll then want to use a negative stagger value for the right-to-left typing, or from: 'end'. More here: https://greensock.com/docs/v3/Staggers 1 Link to comment Share on other sites More sharing options...
Solution GreenSock Posted December 27, 2021 Solution Share Posted December 27, 2021 I dropped a new rtl: true option into this [unreleased] version of TextPlugin - does it work the way you hoped? https://assets.codepen.io/16327/TextPlugin3.min.js See the Pen wvrpPqv?editors=0010 by GreenSock (@GreenSock) on CodePen 3 Link to comment Share on other sites More sharing options...
Tr0xi Posted December 29, 2021 Author Share Posted December 29, 2021 I ended up creating the desired effect using the SplitText plugin, but that does indeed work like how i pictured it! Thank you! 1 Link to comment Share on other sites More sharing options...
Nameless415 Posted March 4 Share Posted March 4 On 12/27/2021 at 8:49 PM, GreenSock said: I dropped a new rtl: true option into this [unreleased] version of TextPlugin - does it work the way you hoped? https://assets.codepen.io/16327/TextPlugin3.min.js Hey! I was just looking for this, but didn't find anything related to it on the docs, just a heads up so you guys can update it! It works just as expected, thanks very much btw 1 Link to comment Share on other sites More sharing options...
GreenSock Posted March 5 Share Posted March 5 Thanks for pointing that out, @Nameless415. We'll get that added to the docs. 👍 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