-3

I want to disable scrolling when the modal opens. I've seen discussions about this referring to bootstrap, but I'm not using bootstrap, all my code is custom. Is there any way I can incorporate this method with the code below:

function mobileNav() {
  $('.menu-toggle').on('click', function(){
    var status = $(this).hasClass('is-open');
    if(status){
      $('.menu-toggle,.side-menu,').removeClass('is-open');
    }else {
      $('.menu-toggle,.side-menu').addClass('is-open');
    }
});

(Code as a screenshot)

Alexander van Oostenrijk
  • 4,644
  • 3
  • 23
  • 37
robert Grant
  • 1
  • 1
  • 1
    Add your code, not just an image of the code. – Adam Buchanan Smith Sep 16 '16 at 18:48
  • 1
    Possible duplicate of [Prevent BODY from scrolling when a modal is opened](http://stackoverflow.com/questions/9538868/prevent-body-from-scrolling-when-a-modal-is-opened) – Adam Buchanan Smith Sep 16 '16 at 18:49
  • Check: http://stackoverflow.com/a/28411556/1760313 – Tom Sep 16 '16 at 18:50
  • Hey man, welcome to StackOverflow! There are a lot of answers here already about how to achieve this, mainly javascript solutions toggling a class in the body tag. You would get a much better response/answer if you provide a [**Minimal, Complete, and Verifiable example**](http://stackoverflow.com/help/mcve). An alternative to the JS solutions you will find, the same thing can be achieved with pure CSS. [**demo**](https://jsfiddle.net/rickyruizm/wn6atzeL/). – Ricky Ruiz Sep 16 '16 at 19:14
  • @AdamBuchananSmith Sorry, I'm new to this and was having problems posting the code. My only solution was to post an image instead. – robert Grant Sep 17 '16 at 00:40

2 Answers2

3

When you open the modal, add the following css to body:

overflow: hidden;
holtc
  • 1,780
  • 3
  • 16
  • 35
0

You can use overflow: hidden in the css of the modal to prevent scrolling.

JQuery has a useful function called toggleClass which would make your code more readable.

Community
  • 1
  • 1
knutesten
  • 594
  • 3
  • 16
  • I've added a class to the body, but when I check to see if it works in the inspector it doesn't appear. Thanks for answering my question. – robert Grant Sep 17 '16 at 00:49