[Scrolltrigger multiple PIN order]

Hi everyone,

I am using the PIN functionality to make different types of animation on one page.

I noticed that if I change the display order, the pin does not work correctly.

 

Working example order:

HTML

1: js-pin-animation-type-01

2: js-pin-animation-type-02

 

JS

1: js-pin-animation-type-01

2: js-pin-animation-type-02

 

See the Pen MWEdgvV by valerio-acerbis (@valerio-acerbis) on CodePen

 

 

Example order NOT working:

 

HTML

1: js-pin-animation-type-02

2: js-pin-animation-type-01

 

JS

1: js-pin-animation-type-01

2: js-pin-animation-type-02

 

https://codepen.io/valerio-acerbis/pen/yLzWBLo

See the Pen yLzWBLo by valerio-acerbis (@valerio-acerbis) on CodePen

[ScrollTrigger: how can I remove the "pin-spacer"?]

Hello,

how can I remove the <div> "pin-spacer" which is dynamically added via pin: true ajax?

I have asynchronous navigation and I should remove this DIV at every page change. How can I do?

I have tried ScrollTrigger.kill (); which removes everything but I can't initialize again after the asynchronous page change.

Many Thanks!

[Sprite animation sequence with New ScrollTrigger]

Hi Jack,

could you instead show me how you would do the same animation using multiple separate images instead of a single sprite image?

Do you have any solution to better manage the uploading of images and the waiting time?

 

In this codepen for example 148 separate images are used:

 

 

Single image link:
https://www.apple.com/105/media/us/airpods-pro/2019/1299e2f5_9206_4470_b28e_08307a42f19b/anim/sequence/large/01-hero-lightpass/0001.jpg

 

Thanks for your help.

[Sprite animation sequence with New ScrollTrigger]

It seems perfect to me!
Many Thanks!!!!!

[Sprite animation sequence with New ScrollTrigger]

 

Hi everyone,

I would like to reproduce the Apple AirPods effect of this pen with ScrollTrigger:

 

 

Here is an example made with scrollMagic:
 

https://webdesign.tutsplus.com/tutorials/how-to-animate-a-coffee-drinking-sprite-with-scrollmagic--cms-24795

 

Can you help me join these Pen by using the new scrollTrigger Plugin?

Thanks so much

See the Pen ZEbGzyv by j-v-w (@j-v-w) on CodePen