Vertical then horizontal with drag then vertical again breaks at the end but only when vertical is enabled

[furley]

Hi, I am having an issue with vertical and horizontal scrolltrigger, it works great without setting up the drag I have commented in the js on codepen the problem area, it seems to nearly duplicate the width when I turn drag on. I tried fixing this by dividing by the number of slides and it fixed it but I'm still not really sure why.

Then at the end, it jumps from the slide if you comment out the bit then uncomment it shows the difference any idea how to fix this?

Any help would be greatly appreciated!!

Thanks in advance

See the Pen ExGqBpB by Steve-Furley (@Steve-Furley) on CodePen

[Rodrigo]

Hi,

 

The issue is happening regardless of the Draggable instance. I think this might be related to your HTML/CSS setup more than a GSAP/ScrollTrigger/Draggable problem.

 

Here is a simpler setup that seems to work OK:

See the Pen PoVYWJb by GreenSock (@GreenSock) on CodePen

 

However I would definitely study this example (no need for the container animation and ScrollSmoother) and see how it gets done with Observer:

See the Pen NWMxRvM by GreenSock (@GreenSock) on CodePen

 

Hopefully this helps.

Happy Tweening!

[furley]

Perfect thanks for your help that worked perfectly!!!!