amit95 Posted September 15, 2022 Share Posted September 15, 2022 I'm trying to create a text reveal effect which is similar to the hero section on this website. I'm using Splitting.js to segment out the characters and then want to use GSAP to animate the characters up. However, the animation doesn't do anything? I've tried two different approaches in my pen, but neither trigger any animation. Upon inspecting my code, I can see that Splitting JS is successfully segmenting out the characters, but GSAP is doing nothing with it? See the Pen abGpaWy by amit_rai95 (@amit_rai95) on CodePen Link to comment Share on other sites More sharing options...
Rodrigo Posted September 15, 2022 Share Posted September 15, 2022 Hi @amit95, Unfortunately we can't give support for third party tools especially when involves going out of our way to learn a bunch of APIs. In this case GSAP has it's own tool for this: SplitText plugin. On a quick inspection I recommend you to take a better look at Splitting.js API and check the result of the method you're using: https://splitting.js.org/guide.html#splitting Specially what it returns, an object with one or more arrays of the DOM elements resulting from the split, those should be able to work with GSAP, although it is highly recommended to use SplitText instead. Happy Tweening!!! Link to comment Share on other sites More sharing options...
Solution GreenSock Posted September 16, 2022 Solution Share Posted September 16, 2022 It looks to me like the problem is just your selector text. There's no such thing as "hero__content h1 .char" in your file. Try just "h1 .char" and it appears to work. 👍 2 Link to comment Share on other sites More sharing options...
amit95 Posted September 16, 2022 Author Share Posted September 16, 2022 Ah, typo on my end, got to love them 🙃 But, that did the trick, many thanks! 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