MichaelT2023

Oh dear, I knew, it can't be that complicated. Thank you very much for the explanation.

Thank you, that helped. I edited my original post and added the codepen by forking your template.

Hey guys, maybe I'm completely blind now after trying to get this to work for hours, but maybe you can help me out? I think the solution is very simple, but I just don't get it. So the overlay element shouldn't be visible, until the top of the first panel hits the center of the viewport. Then the overlay should fade in, with opacity: 1, when the center of the first panel hits the center of the viewport. When the center of the last panel hits the center of the viewport, the overlay should start to fade out, being completely invisble when the bottom of the last panel hits the center of the viewport. But the overlay is visible, when I start the page, doesn't matter, if I set the opacity to 0 with CSS or GSAP. Also I had issues when I move the overlay to the x/y-center of the viewport (commented out in css). But that seems to work now. Maybe you can give me a gentle push in the right direction. And if you have any suggestions regarding the overall GSAP code, ideas are very welcome. Thank you Michael