problem with slideshow ScrollTrigger

[sybilrondeau]

Hi. I am trying to make a slideshow and I have a problem with a little recess on the last picture when we want to quit the section. It's like it quit the animation but it's been pinned again before we can really scroll down to the next section. That's annoying and I can't find a solution. Do you have an idea why ? 

Also, I made two different timelines and create two ScrollTriggers for this section. Was it doable in juste one timeline and one ScrollTrigger ? (as it is the same trigger for both, I just have a snap added to the pictures side. 

At last, that's weird because snap works here in codepen but doesn't in my real project... 

Thank you for you help !

See the Pen QWyjRzr by sybilrondeau (@sybilrondeau) on CodePen.

[ZachSaucier]

Hey sybilrondeau. Would you mind making an actual CodePen instead of a static site? They're much easier for us to look through the code and be able to edit it ourselves:

 

[sybilrondeau]

hi, it is a project, and whenever I put the url here I got this... do I need to make a Pen instead ? 

[ZachSaucier]

3 minutes ago, sybilrondeau said:

do I need to make a Pen instead ? 

That would make us helping you much easier, yes.

[sybilrondeau]

Done !

[ZachSaucier]

There are several ways to setup this sort of thing.

 

1 hour ago, sybilrondeau said:

I have a problem with a little recess on the last picture when we want to quit the section. It's like it quit the animation but it's been pinned again before we can really scroll down to the next section. That's annoying and I can't find a solution. Do you have an idea why ? 

It's because you have two ScrollTriggers both trying to pin the .portfolio element. One of them has end: "+=100%" and the other has end: "+=120%". So they're in conflict with each other.

 

1 hour ago, sybilrondeau said:

Also, I made two different timelines and create two ScrollTriggers for this section. Was it doable in juste one timeline and one ScrollTrigger ? (as it is the same trigger for both, I just have a snap added to the pictures side. 

Sure, it just takes careful construction of the timeline:

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

[sybilrondeau]

Awesome ! Thank you very much !