Pinned section with image sequence

[Marcos Aidos]

Hello fellow "gsapers",

 

I'm looking for some guidance on how to achieve the effect i want.

 

The main effect i want its like this codepen i linked.

 

I have an dinamic array of section that will be pinned just like that codepen, but then each one of those sections will have an image sequence. 

When the image sequence of one section ends then it should transition to the next section, and then start the corresponding image sequence (all this controlled by user scrolling).

 

I got the sections transition working just like the codepen, but i dont know how to approuch to make the transition wait until the section image sequence end and then do the section change.

 

I would be very thankfull if someone could point me in the right direction. I'm a bit lost, and still new to gsap.

 

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

[iDad5]

I'm not 100% sure if that's what you are looking for, but container animation might just be it: