# Menu hides on scroll but appears when scroll stop

**URL:** <https://forum.pinegrow.com/t/menu-hides-on-scroll-but-appears-when-scroll-stop/7660>\
**Category:** Pinegrow Interactions Add-on\
**Tags:** interactions, question\
**Created:** [January 19, 2023, 8:06pm UTC](https://forum.pinegrow.com/t/menu-hides-on-scroll-but-appears-when-scroll-stop/7660 "2023-01-19T20:06:43Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Hannah](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/hannah/32/5047_2.png) [@Hannah](https://forum.pinegrow.com/u/Hannah)\
**Post date:** [January 19, 2023, 8:06pm UTC](https://forum.pinegrow.com/t/menu-hides-on-scroll-but-appears-when-scroll-stop/7660/1 "2023-01-19T20:06:43Z")

</div>

I’m trying to get my fixed Navbar to disappear as I scroll down but appear when I stop scrolling. Similarly disappear when I scroll up and appear again when the scroll stops. I’ve been trying for a good couple of hours with no success. There is an old tutorial that shows how to do this but it includes setting the fixed position with interactions:I’ve already done this with css. Any help would be greatly appreciated.

---

<div class="post-metadata">

**Author:** ![jonroc](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/jonroc/32/2805_2.png) [@jonroc](https://forum.pinegrow.com/u/jonroc)\
**Post date:** [January 20, 2023, 6:59pm UTC](https://forum.pinegrow.com/t/menu-hides-on-scroll-but-appears-when-scroll-stop/7660/2 "2023-01-20T18:59:47Z")

</div>

Hello 🙂

I don’t use the interactions plugin (because of its limitations) with PG but it’s based off of GreenSock so you may be able to hand-code a solution. Here is some code I used for a mobile, fixed cta bar that hides/shows as you scroll down/up. You can do the same thing for a header as well.

```auto
  let mobile_menu = gsap.timeline({
    scrollTrigger: {
      trigger: "#site_content",
      toggleActions: "play none none none",
      start: "top top",
      end: "bottom bottom",
      onUpdate: (self) => {
          if(self.direction == -1){
            mobile_menu.reverse();
          } else if (self.direction == 1){
            mobile_menu.play();
          }
      }

    }
  });

  mobile_menu.to("#menu_items", { duration: 1, bottom: -400 });

```

---

<div class="post-metadata">

**Author:** ![Hannah](https://yyz2.discourse-cdn.com/flex036/user_avatar/forum.pinegrow.com/hannah/32/5047_2.png) [@Hannah](https://forum.pinegrow.com/u/Hannah)\
**Post date:** [January 21, 2023, 9:04am UTC](https://forum.pinegrow.com/t/menu-hides-on-scroll-but-appears-when-scroll-stop/7660/3 "2023-01-21T09:04:56Z")

</div>

Thank you so much for the reply, I had almost given up on making that work. I will try and let you know how it goes.