davdev

The start point of the element to be pinned does not match the element, the start point is way too much above the element itself. I don't mean the scroller-start and end, those ones are okay as i set them in the code but when i look at my markers the start of the pinned element is not on the element but somewhere about, which makes my scroll trigger start before it's support to. What can be the issue please // Create a GSAP timeline for the pinning effect const pinningTimeline = gsap.timeline({ scrollTrigger: { trigger: ".steps-count", start: "top 10%", end: "+=10000", pin: true, markers: true, pinSpacing: false, } }); // Your animations or timeline for the second div (div2) scroll const scrollTimeline = gsap.timeline({ scrollTrigger: { trigger: ".steps-cards-container", start: "top center", end: "bottom top", scrub: true, } }); // Define animations for the second div scrollTimeline.to(".steps-cards-container", { y: -200, // Adjust the scrolling direction as needed opacity: 0.5, });