PixelDynamics Posted November 9, 2021 Share Posted November 9, 2021 Hi Guys, I'm brand new to using GSAP and I've been working on getting the text to appear from a masked line and I've got it working perfeclty by line and also by words! My issue is that even though I've added <u>/<u> around certain words and even written <span style="text-decoration:underline;"></span> whenever the script executes it doesn't display the underline. I'm also struggling with getting the text to display on scroll instead of all just appearing when utilising the same script but in a longer paragraph. Any help would be GREATLY appreciated. Thank you so much. Paul See the Pen OJjEWQX by PixelDynamics (@PixelDynamics) on CodePen Link to comment Share on other sites More sharing options...
Solution PointC Posted November 9, 2021 Solution Share Posted November 9, 2021 Hi @PixelDynamics Welcome to the forum. I think I'd just add a pseudo-element to that div for the underline effect. Something like this. See the Pen aa65e5941028e17a675bfb20504f3867 by PointC (@PointC) on CodePen Hopefully that helps. Happy tweening and welcome aboard. 5 Link to comment Share on other sites More sharing options...
Cassie Posted November 9, 2021 Share Posted November 9, 2021 47 minutes ago, PixelDynamics said: I'm also struggling with getting the text to display on scroll instead of all just appearing when utilising the same script but in a longer paragraph. In terms of the text-on-scroll bit - have you seen our scroll plugin ScrollTrigger? It makes scroll animations nice and easy! See the Pen MWvXmpa by GreenSock (@GreenSock) on CodePen 3 Link to comment Share on other sites More sharing options...
PixelDynamics Posted November 9, 2021 Author Share Posted November 9, 2021 Amazing! Exactly what I was looking for, thank you. 1 Link to comment Share on other sites More sharing options...
Cassie Posted November 9, 2021 Share Posted November 9, 2021 Fab! And if you wanted to show the text line by line you could do something like this - See the Pen NWvzjLW by GreenSock (@GreenSock) on CodePen Hope this helps! ✨ 4 1 Link to comment Share on other sites More sharing options...
PixelDynamics Posted November 9, 2021 Author Share Posted November 9, 2021 Thank you so much Cassie! This is perfect! 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