jquery - 我正在尝试修复的移动导航问题(JS 或 CSS)

Question

我目前在创建移动导航时遇到问题。这是一个简单的汉堡包图标，当您单击它时，它会打开一个全屏菜单。问题是我试图在叠加层可见时禁用滚动。现在我想我可以通过添加来实现这一点；

$('body').bind('touchmove', function(e){e.preventDefault()});

但这不会在点击事件中切换。我将如何实现它，以便它切换？再次单击时应该可以再次滚动。完整脚本；

$(document).ready(function () {
  $(".icon").click(function () {
    $('body').bind('touchmove', function(e){e.preventDefault()});
    $(".mobilenav").fadeToggle(500);
    $(".top-menu").toggleClass("top-animate");
    $(".mid-menu").toggleClass("mid-animate");
    $(".bottom-menu").toggleClass("bottom-animate");
  }); 
});

Answer 1

非常有用的链接:

How to programmatically disable page scrolling with jQuery此代码有效

$(document).ready(function(){
   $("button").click(function(){
      $('html, body').css({
         overflow: 'hidden',
         height: '100%'
      });
      $("p").toggleClass("main");
   });
   $('html, body').css({
   overflow: 'auto',
   height: 'auto'});  
});