Jump to content
Search Community

Locomotive scroll + horizontal scrolling section issue

qvstudio test
Moderator Tag

Recommended Posts

Hey there!

 

You're targeting 'section' elements to do the horizontal scroll, but you've got loads of 'section' elements outside of that wrapper.

 

const sections = gsap.utils.toArray("section");

 

You'll need to be more specific about the elements you're targeting. Your CSS is also not laying the sections out correctly.

My advice is always to isolate the issue, fix and then re-integrate.

Here's a step in the right direction.

 

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

  • Like 1
Link to comment
Share on other sites

I can't help without a demo I'm afraid!

 

If I were you I would try implementing it bit by bit. Get the horizontal scroll working first, then add the code to handle the drag.

 

If it's possible to remove other animations while you're testing the functionality then do so.

Link to comment
Share on other sites

Hi @qvstudio. Unfortunately LocomotiveScroll is not a GreenSock product and we can't support it here. I have definitely seen some odd behavior with it, but I'm really not terribly familiar with it so perhaps I'm misunderstanding some things. 

 

Confidentially, we are working on something that may make this much easier for you - it's a tool that'll only be available to "Shockingly Green" and "Business Green" Club GreenSock members. If you'd like early access, you're welcome to sign up and request that. No pressure, though. 

 

I really wish there was more we could do to help, but this looks like a LocomotiveScroll issue. If you believe that isn't the case, please provide a minimal demo that doesn't use LocomotiveScroll and still shows the problem and we'd be happy to take a peek. 

Link to comment
Share on other sites

That looks like pretty much the same demo, and it's still using LocomotiveScroll.

 

You looked for ".section" but there are no such elements. I assume you meant ".box". 

 

Like I said, we cannot support 3rd party libraries in these free forums. If I remove LocomotiveScroll, it works as expected: 

See the Pen mdBQvrX?editors=0110 by GreenSock (@GreenSock) on CodePen

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.
×
×
  • Create New...