javascript - 如何禁用导航覆盖中的主体滚动并在主体中启用它？

Question

大家好，我正在寻找禁用导航叠加层中正文内容滚动的答案，但是当我关闭导航叠加层时，正文滚动应该开始工作，但我无法做到这一点。

我在 Stackoverflow 上找不到任何正确答案。任何帮助将不胜感激。

Answer 1

您可以使用 JavaScript 将主体溢出(或任何元素的)设置为隐藏，当叠加层打开并将其设置回自动当您单击关闭按钮时。

$('.open-overlay').click(function() {
    $('body').css('overflow', 'hidden');
});
$('.close-overlay').click(function() {
    $('body').css('overflow', 'auto');
});

这是一个工作 fiddle :https://jsfiddle.net/44gk77d3/1

编辑:我添加了通过单击同一个按钮来启用/禁用溢出的选项。

https://jsfiddle.net/44gk77d3/2/