onMounted(() => {
//fadeIn
const fadeIn = gsap.utils.toArray(".fade-in")
fadeIn.forEach((bg, i) => {
console.log(bg)
gsap.to(bg, {
scrollTrigger: {
trigger: bg,
start: "top 40%",
end: "top 20%",
scrub: 3,
markers: true,
},
opacity: 1,
})
})
})
The position of the scroll trigger markers in the onMounted can be adjusted using the 'start' and 'end' properties,
but how do I adjust the 'start' and 'end' of the pink object on the left side of the image?