Is there anyway to add delay to scrollTrigger?

[Preet Sojitra 0 Likes (Newbie)]

I want to add delay to scrollTrigger, is there anyway to do so?

 

Here's code:

 

useEffect(() => {

    gsap.to(changeBg.current, {

      scrollTrigger: {

        trigger: changeBg.current,

        markers: true,

        scrub: 0.5,

        start: "top 10%",

        end: "bottom 90%",

      },

      backgroundColor: "black",

    })

  })

 

I don't want to apply this animation as soon as it triggers, but instead want to apply after some time. Can I do that?

[GreenSock 17,882 Likes (Superhero)]

How could that even work if you have a scrub value defined? Like...if the user scrolls to 50% into the ScrollTrigger's area, you want it to ignore that for a while and then suddenly scrub the animation to 50%? And then if they scroll more to 80%, do you again want the animation to stay stuck at 50% for a while, and then after a certain amount of time elapses, it scrubs to that 80%? And what happens if they scroll to 80%, the time elapses, and WHILE it is scrubbing, the user scrolls again? 

 

I mean I suppose you could disable scrub and do your own scrub tween inside an onUpdate, and apply a delay to that. Seems a bit odd though. It would definitely help if you provided a minimal demo so we can better understand this in context.