Question

如果在移动设备上打开菜单，如何停止身体滚动？

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

Answer 1

请在CSS中添加它。

body.onScroll {
  overflow:hidden;
}

Answer 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;
}

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

让我知道是否需要更多帮助。

如果在手机中打开菜单，如何停止身体滚动？

2 个答案: