Disable Scroll with open menu

Asked

Viewed 524 times

0

I have a menu with width 100% and height 100%, in which I use a button to open it and close it (hamburger style). But when he opens my site, he still scrolls behind it. I want to know how I can disable the site scroll when the menu is open, and disable when closing the menu.

  • Tiago, I believe you mean offcanvas (hamburger style?), you can simply put a div de overlay on the contents, disable the overflow, etc... in any case you will be welcome the HTML page.

2 answers

1


I don’t quite get it, but maybe this will do the trick:

You can add an event scroll by jQuery. When the person scrolls the page he checks if the menu is open. If it is open, he forces the scrollTop at all times zero (top).

Example: https://jsfiddle.net/Lkodmu2s/

  • Perfect, it worked. Just a rewrite. The script is taking the scroll to the top when menu visible, ok, great! But there is no way to disable the scroll when menu visible? 'Cause if I’m halfway through the site, and I open the menu and I try to scroll it takes the site to the top, and it bothers me a little bit.

  • Yes. Dai can save the bar position when the menu opens, so this value applies when the person tries to scroll the page. I did here as I would: https://jsfiddle.net/Lkodmu2s/4/

  • Dude, your test is working, but mine isn’t. Can you see if there’s something wrong with my code? follow https://jsfiddle.net/rg3938yx/ @Ricardo

  • You forgot to set the scroll value variable. Try this: https://jsfiddle.net/rg3938yx/1/

  • It worked fine, Ricardo!! Thank you so much for your help :))))

  • You’re welcome :D @Tiagop. C

Show 1 more comment

-2

  • That doesn’t answer my question or help me find some solution.

  • To find a solution, I need to see what you’ve done so far. In the meantime see if this helps you: http://stackoverflow.com/questions/4770025/how-to-disable-scrolling-temporarily

Browser other questions tagged

You are not signed in. Login or sign up in order to post.