Sync (Observer & ScrollTrigger & ScrollSmoother)

[noviedo 35 Likes (Newbie)]

I just took the GSAP Horizontal Scroll pen with ScrollTrigger, and I added ScrollSmoother and this works perfectly. And also I have a requirement to do draggable the horizontal section, so for that I used the Observer plugin to use the onDrag function to update the scroll() of the main ScrollTrigger. So, this also works fine, but I wanna reach a smooth movement on the drag, like a ('lerp' ,'momentum', 'inertia') as when I scroll, but I can't reach. Any suggestions are welcome.

I did this to update the scroll value of the ScrollTrigger.

 

Observer.create({
  target: ".container",
  type: "wheel,touch,pointer",
  onDrag: (self) => {
    scrollTween.scrollTrigger.scroll(
      scrollTween.scrollTrigger.scroll() - self.deltaX
    );
  }
});

Thanks so much! 

See the Pen GRdJazK by nazarenooviedo (@nazarenooviedo) on CodePen

[GreenSock 18,295 Likes (Superhero)]

Here's how I'd do it using a quickTo(): 

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

 

Does that help? 

[noviedo 35 Likes (Newbie)]

thanks so much Jack! it's just I needed 🙏