锁定父卷轴，只允许div滚动

Question

我创建了一个弹出窗口，弹出主页面。它是position:fixed;和overflow:scroll;。

问题是，除非用户将鼠标放在此div上，否则触摸鼠标或滚轮上的滚动功能会滚动父窗口 - 而不是div。这同样适用于触控板。

有没有办法锁定父窗口的滚动，并将div设置为滚动浏览jQuery？我找到了很多关于相反的帖子 - 人们希望看看div滚动并使用父母。

非常感谢任何帮助。

Answer 1

如果你想使用jquery，可以在弹出窗口时将body的溢出设置为隐藏，并在弹出窗口消失时撤消：

的CSS：

body.popup-open {
    overflow: hidden;
}

和jquery：

$("#popup").on("show", function () {
  $("body").addClass("popup-open");
}).on("hidden", function () {
  $("body").removeClass("popup-open")
});