How to remove that pin space if use once true

[Renny_0007]

Hey guys 

 

im  not a expert into scrolltrigger but i have done something.

Problem is if i have use once:true them scroll back receive lot of space

So help to fix that 

Thanks
Renny

See the Pen YzaBzeW by renny-solace (@renny-solace) on CodePen

[Rodrigo]

Hi,

 

This seems to work the way you expect:

const tl = gsap.timeline({
  scrollTrigger: {
    trigger: ".get_started_main",
    start: "center center",
    pin: ".wrapper",
    scrub: true,
    markers: true,
    onLeave: (self) => {
      const start = self.start;
      self.scroll(start);
      self.kill();
      self.animation.progress(1, true);
      ScrollTrigger.refresh();
      window.scrollTo(0, start);
    },
  }
});

Here is a fork of your demo:

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

 

Hopefully this helps.

Happy Tweening!

[Renny_0007]

@Rodrigo

Thank you very much for your help

 

There are only one issue, basically im using scrollsmoother also so after that 3 box complete page jump to that statring point.

just update my code into codygen 

[Rodrigo]

Hi,

 

There is definitely something else in your demo causing this. I updated our demo to use ScrollSmoother and as you can see is working as expected:

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

 

Hopefully this helps.

Happy Tweening!