如果在移动设备中打开菜单，如何停止正文滚动？答案

【问题标题】：How to stop body scroll if open menu in mobile?如果在移动设备中打开菜单，如何停止正文滚动？
【发布时间】：2020-02-13 20:44:47
【问题描述】：

如果我在移动设备上打开菜单，如何停止正文滚动？

function bodyScrollStop() {
  $('.header .navbar .navbar-toggler i').on('click', function (event) {
    $('body').toggleClass("onScroll");
  });
}
bodyScrollStop();

【问题讨论】：

标签： javascript jquery html css web

【解决方案1】：

请在css中添加这个..

body.onScroll {
  overflow:hidden;
}

【讨论】：

谢谢你给我解决方案，但我真的想要当我点击移动屏幕上的导航菜单图标时
ok no pbs -:) 你可以使用任何你想要的......但是你可以在点击按钮时添加类。

【解决方案2】：

好吧，我相信您只在移动屏幕上显示了该切换按钮。然后你可以试试下面的代码。

JS Fiddle Link

JS代码：

function bodyScrollStop() {
  $('.header .navbar .navbar-toggler i').on('click', function (event) {
    $('body').toggleClass("no-scroll");
  });
}
bodyScrollStop();

CSS：

i {
  background: green;
  height: 44px;
  width: 44px;
  display: inline-block;
  color: #fff;
}

.no-scroll {
  overflow: hidden;
}

现在，如果您单击该切换器主体将获得动态类并阻止它滚动。

如果您需要更多帮助，请告诉我。

【讨论】：