Scrolling changing image and background color

[Cloudio]

Hi, how do i change image (cup) on scroll? And how do i center it? i tried changing the start and end in the scrolltrigger function but after the first section the pin doesn't work anymore 

See the Pen BawJWpp by Cloudio12 (@Cloudio12) on CodePen

[OSUblake]

Here's a pen that does something similar. Notice how it pins the left content element and not everything inside of it.

 

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

 

2 hours ago, Cloudio said:

And how do i center it?

 

Here's a tutorial on centering with flexbox. The parent of the image would need to have those flex properties.

https://philipwalton.github.io/solved-by-flexbox/demos/vertical-centering/