Prevent Reverse of scrollTrigger scrub:true

[s15199d]

How do I prevent reversing when the user scrolls back up the page?

 

gsap.to(".img-container", {
    scale: 1.8, x: "-30%", y: "30%",
    scrollTrigger: {
        trigger: "#home-hero",
        start: "-107px",
        end: "+=120%",
        //markers: true,
        pin: true,
        scrub: true
    }
});

 

[GreenSock]

Are you saying you want the animation to only ever go forward and never backward, and you want it to "scrub" (but again, only in one direction)? So let's say you scroll forward 500px which (to make it simple) is 50% through the animation...and then you scroll backwards all the way to the start, you want the animation to stay stuck at 50%, right? And then if you scroll forward again 500px, absolutely nothing would happen? But then once you go forward more, like to 600px, it would scrub forward accordingly? 

[GreenSock]

If my assumptions above are correct, I'd imagine it could look like this: 

let tween = gsap.to(".img-container", {scale: 1.8, xPercent: -30, yPercent: 30, paused: true});
ScrollTrigger.create({
  trigger: "#home-hero",
  start: "-107px",
  end: "+=120%",
  pin: true,
  onUpdate: self => {
    if (self.direction === 1 && self.progress > tween.progress()) {
      tween.progress(self.progress);
    }
  }
});

Does that help?

[s15199d]

Thanks for the response...your first response actually got me to thinking, and I decided to let it reverse.