SCROLLTRIGGER problem reset position

[Antoine Thenoz]

Hi,

 

I'm new using ScrollTrigger and I face a problem.

I want, like in the codepen, to move an element (x position) when I click on a button (green bloc) and then move his position x again with a scrolltrigger but when I scroll, the position reset to his first position (before the first animation move) and I don't want that.

 

If someone can help,

 

Thanks,

Antoine

See the Pen zYMMaex by Antoine-Thenoz (@Antoine-Thenoz) on CodePen

[GreenSock]

By default, any tween with a ScrollTrigger will render immediately so that it's ready to go very quickly when scrolling (performance optimization). In your case, you seem to want to avoid that, so just set immediateRender: false:

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

 

Just be careful with the way you're setting things up because if the user clicks that button multiple times, you'll end up creating a bunch of tweens/ScrollTriggers that could conflict - do proper cleanup to avoid that.