How to allow full screen nav menu to scroll

Design help General
1

I’m having a bit of an issue with my full screen nav menu. The nav menu is visible on all devices and when I click to open the menu, it displays correctly. However, when I try and scroll, it scrolls all of my main page content, keeping the nav menu fixed. I need a way to disable the elements behind it and allowing a user to scroll on the nav bar for overflow content. I tried setting a high z-index on the nav menu wrapper, but that didn’t do anything. When setting the nav menu to relative instead of fixed, it stays fixed to the top and when I’m halfway down the page and open the menu, it isn’t visible until I scroll all the way back to the top.

I’ve shared my link below. If anyone has any thoughts, I’d love to hear them. Thanks!

Here is my site Read-Only: https://preview.webflow.com/preview/jacobtrujillo?utm_medium=preview_link&utm_source=designer&utm_content=jacobtrujillo&preview=f7c196fa2339f45e59878f101141c98b&pageId=5ed68dd8a8763b1b0862619a&itemId=5edaf8662a8e7baa375b5cfd&mode=preview

2

Hi @jtrio3

For better assistance - I think it is good idea to share your published link of your site and maybe record your screen while you are trying to scroll :slight_smile:

3

Here’s a link to the screen recording. Webflow demo.mov - Google Drive

And as you’ll see, there’s a bit more content of that menu that extends beyond the view port but when scrolling, it’s only scrolling the page content behind it.

4

Hi,
I’m having thee same problem. Did you ever find a solution? Thank you

6

Hi Joanne, I think that this is what you’re looking for.