[ScrollTrigger: .kill() or ”destroy” one specific ST-instance?]

On 4/20/2021 at 9:10 PM, GreenSock said:

That doesn't sound right - do you have a minimal demo showing this? 

 

@akapowl is correct about his suggestion. It just concerns me that you said killing one instance kills ALL instances, hence my request for a minimal demo. 

I was doing this with Laravel Mix (webpack) and AlpineJS. If it was unexpected behavior from GSAP's side, it was probably due to some other environmental related issue. How ever, the ID-solution did work out splendedly

[ScrollTrigger: .kill() or ”destroy” one specific ST-instance?]

On 4/20/2021 at 3:55 PM, akapowl said:

You could give your ScrollTrigger an ID

Sorry for not responding earlier — yes! this solved my problem!

[ScrollTrigger: .kill() or ”destroy” one specific ST-instance?]

I have a ScrollTrigger that I've created like this;

let ST = ScrollTrigger.create({ ...

In my usecase, I only want to diable/kill/destroy that specific instance.

BUT — when I run;

ST.kill();

this kills ALL of my other ScrollTriggers, globally.

 

Is that intended behavior? If so, how can I just remove one instance? 🤔

 

Cheers!

[ScrollTrigger: Pin to when the trigger element is in top, but start animation when in center?]

Thanks a lot, exactly what I need. Didn't even think about that but it makes perfect sense

[ScrollTrigger: Pin to when the trigger element is in top, but start animation when in center?]

Is it possible to have the Timeline's playhead scrubbed before the element is getting pinned?

So what I want is:

 

animation:

start: "top center"

end:  "bottom center"

 

pin:

start: "top"

end: "bottom"

 

Or can the same result be achieved some other way?

See the Pen abZQRrV by slebbo (@slebbo) on CodePen