neworigin Posted March 29, 2021 Share Posted March 29, 2021 After going through a few of the tutorials I tried my hand at creating a parallax layout using the ScrollTrigger library. What I am trying to do is have the text slide in and have the photo fade in and then scroll upwards at different speeds to create the parallax effect. I know I need to loop through the sections but it looks like it is applying the transformations across all sections rather than each one. See the Pen mdRrxMN by neworigin (@neworigin) on CodePen Link to comment Share on other sites More sharing options...
ZachSaucier Posted March 29, 2021 Share Posted March 29, 2021 Hey neworigin and welcome to the GreenSock forums. You're making one of the most common ScrollTrigger mistakes: using general selectors when you should use scoped ones. The article goes into more details about how to fix it. 3 Link to comment Share on other sites More sharing options...
neworigin Posted March 30, 2021 Author Share Posted March 30, 2021 Thanks so much for the quick response! I took a look at the article you sent and indeed the selectors was the issue. I've updated the codepen and the parallax seems to be working. Any thoughts on the best approach for fading in the elements? I started to figure out togglreClass but wondering if you have another handy link with an example? Link to comment Share on other sites More sharing options...
ZachSaucier Posted March 30, 2021 Share Posted March 30, 2021 First off, when posting a demo to these forums please use the "fork" button so that the old version is retained. That way context is not lost for other readers As for the fading, I'd likely create a timeline with whatever animations that you need and attach the ScrollTrigger to the timeline instead. 3 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