Jump to content


How to stop onUp and onDown for a certain element ScrollTrigger?

Recommended Posts

I want touch and scroll to not function when they are on a certain element. I tried using ignore and it worked for a div that covers the whole page, but not for the one I am using which covers half of it. Any idea how I can fix it?


    target: window,
    ignore: startScreen || carousel,
    type: "wheel, touch",
    onUp: () =>mainFunc(index- 1), 
    onDown: () =>mainFunc(index+ 1),

Link to comment
Share on other sites



Without a minimal demo is hard to know exactly what you're trying to do. The only suggestion I could offer is to create another ScrollTrigger instance for the element that covers half of the screen and toggle a boolean using ScrollTrigger onEnter/Back and onLeave/Back callbacks and check that boolean in the onUp and onDown callbacks of the other ScrollTrigger.


Let us know if you have more questions.

Happy Tweening!

Link to comment
Share on other sites

Yeah, a minimal demo will help a lot. Also, I wanted to mention that this looks wrong to me: 

ignore: startScreen || carousel

That will only feed in ONE of those. If startScreen is truthy, that's what'll be used. Otherwise, carousel will be used. That's just a JavaScript thing (unrelated to GSAP/Observer). Did you mean to do this?:

ignore: [startScreen, carousel]


Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.