scrollTrigger 'callback' when elements align

[jonsaul]

Hi all, 

 

I was wondering if someone might be able to offer some help with a scrollTrigger setup I am looking to put together...

I would like to be able to know when one of the image blocks on the left comes inline with the pinned element on the right, so that I could do a visual effect on the lined up block, and then remove it and apply to the next block to lineup with the text.

 

Im not entirely sure how to go about his at the moment, my inital thought was to create a whole other scrolltrigger for each block but I doubt that is the way to do this...

 

any help much appreciated...

Thanks

See the Pen OJXMQOL by jonsaul (@jonsaul) on CodePen.

[akapowl]

 

Hey @jonsaul

 

You could (for each image-item) create a ScrollTrigger, that has a start dependent on the height and offset from top of your headline.

 

Maybe something like this

 

See the Pen e73fd19440bed45ddcf8a9e6bade7651 by akapowl (@akapowl) on CodePen.

 

 

[jonsaul]

@akapowl Amazing, thank you, Paul! This looks like just what I need.

 

Great stuff, Cheers!