Jump to content

Lance Woolf

Line Reveal on Scroll for Multiple Elements

Moderator Tag

Recommended Posts

Hi All,

I have the split text animation working ok, scroll trigger is ok. I just need to set my code up to so I can have multiple paragraph tags <p> per page or section. The idea is that I can drop another paragraph element in, slap a class on it and it will reveal when itself is in the viewport.

Currently, I seem to be triggering the lot of elements, rather than a single p element on scroll.


Please see code pen attached, Hopefully it is straight forward. Thanks in Advance.


See the Pen poZoQZK by windpixel (@windpixel) on CodePen

Link to comment
Share on other sites

I assume you wanted to do something like this?: 

See the Pen LYBYMry?editors=0010 by GreenSock (@GreenSock) on CodePen


I added some code to make it responsive just in case. Your current layout has fixed widths, so it doesn't really help much here but if you need to accommodate text reflow on window resize, you've got a solution :)


I hope that helps. And thanks for being a Club GreenSock member. 💚

Link to comment
Share on other sites

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 account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.