Scrolltrigger multiple PIN order

[Simone Bertoloni 1 Likes (Newbie)]

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

[OSUblake 18,367 Likes (Superhero)]

Hi Simone,

 

Creating your ScrollTriggers out of order is a common mistake. See this article.