Here's a video showing the issue.
The grey container is the one I want to pin something to scroll in, and I want the image residing within it to hit the bottom of the container - that's all.
But whenever I try "end end", it completely messes the spacing up
Again, I'm not sure WHICH container should be the long one.
gsap.registerPlugin(ScrollTrigger)
let timeline = gsap.timeline({paused:true})
.to(".scroll-container #analytics-one", {opacity:1,})
ScrollTrigger.create({
animation: timeline,
trigger: '.scroll-container',
scrub: true,
pin: true,
markers: true,
})
I have also given the "scroll Container", some length, to allow it to be long enough to scroll
.scroll-container {
height: 105vh;
}
2022-04-29_17-10-30.webm