[Problems Creating Sticky Nav]

I somehow don't get how to add and remove 2 classes classes like I did it with the code i'm using now 😕

[Problems Creating Sticky Nav]

Hi!
Thanks for the example! 
So I added this and it's working now!  Or is there a better way to do this? Sorry im new to this
 

  onUpdate: self => {
    console.log("progress:", self.progress.toFixed(3), "direction:", self.direction);
            let { direction } = self;
            const featureBoxes = document.querySelectorAll('.main-menu');
 
            if (direction == -1) {
                featureBoxes[0].classList.add('is-sticky')
                featureBoxes[0].classList.remove('is-hidden')
            } else if (direction == 1) {
                featureBoxes[0].classList.add('is-hidden')
                featureBoxes[0].classList.remove('is-sticky')
            }
      }

Thanks!
 

 

[Problems Creating Sticky Nav]

Hi,
I'm new to gsap and would like to create a normal sticky nav menu with few animations which changes classes on scroll up or down.
This is what I am trying to achieve: If you scroll down the menu stays at the top "hidden" but if the user scrolls up a bit the menu should get "sticky visible" and if he continuous to scroll down again "hidden" again.
I just can't get this to work with the toggleActions and toggleClass 🙈
Thanks,

See the Pen vYLpgGY by linkslegend (@linkslegend) on CodePen