Jump to content

Search In
  • More options...
Find results that contain...
Find results in...

ScrollTrigger, Parallax and Locomotive Scroll

Recommended Posts

Hi, I would like to get Locomotive Scroll to work with some parallax code and ScrollTrigger. I am using the demos
Parallax scene on scroll - ScrollTrigger
Locomotive Scroll with ScrollTrigger scrubbing and pinning
but when I add the Locomotive Scroll, it breaks the parallax code.
How do I get the parallax code to work with the Locomotive Scroll?


See the Pen abdaOGg by robmarshall01 (@robmarshall01) on CodePen

Link to comment
Share on other sites

Hey Rob and welcome to the GreenSock forums. Evidently Locomotive Scroll doesn't like fixed elements in the smooth scroll section. 


However you can create parallax effects with ScrollTrigger and Locomotive Scroll just fine. Here's a quickly thrown together example:

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

  • Like 1
Link to comment
Share on other sites

Hi ZachSaucier,


Thank you for the fix... I also have an issue with other tweens not activing when in view. Is this something to do with the Locomotive Scroll plugin?

Please see code.



See the Pen abdaQBz by robmarshall01 (@robmarshall01) on CodePen


Link to comment
Share on other sites

If you're going to use Locomotive Scroll then you need to change the scroller for the ScrollTriggers:

scroller: ".smooth-scroll"


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.