我想让我的身体在使用鼠标滚轮时停止滚动，而我的网站上的Modal(来自http://twitter.github.com/bootstrap)是打开的。
当模式被打开时，我试图调用下面的javascript片段，但没有成功
$(window).scroll(function() { return false; });
AND
$(window).live('scroll', function() { return false; });
请注意，我们的网站放弃了对IE6的支持，IE7+需要兼容。
当前回答
以上的答案都不适合我。所以我找到了另一种行之有效的方法。
只需添加一个scroll.(命名空间)监听器，并将文档的scrollTop设置为它的最新值…
并在关闭脚本中删除侦听器。
// in case of bootstrap modal example:
$('#myModal').on('shown.bs.modal', function () {
var documentScrollTop = $(document).scrollTop();
$(document).on('scroll.noScroll', function() {
$(document).scrollTop(documentScrollTop);
return false;
});
}).on('hidden.bs.modal', function() {
$(document).off('scroll.noScroll');
});
更新
似乎，这不是很好地工作在chrome。有什么建议吗?
其他回答
我必须设置视口高度才能让它完美工作
body.modal-open {
height: 100vh;
overflow: hidden;
}
接受的答案不工作在手机上(iOS 7 w/ Safari 7，至少)，我不希望MOAR JavaScript运行在我的网站上，当CSS将做。
这个CSS将阻止后台页面在模式下滚动:
body.modal-open {
overflow: hidden;
position: fixed;
}
然而，它也有一个轻微的副作用，基本上是滚动到顶部。位置:绝对解决了这个问题，但是，重新引入了在移动设备上滚动的能力。
如果你知道你的视口(我的插件为<body>添加视口)，你可以为这个位置添加一个css切换。
body.modal-open {
// block scroll for mobile;
// causes underlying page to jump to top;
// prevents scrolling on all screens
overflow: hidden;
position: fixed;
}
body.viewport-lg {
// block scroll for desktop;
// will not jump to top;
// will not prevent scroll on mobile
position: absolute;
}
我还添加了这个，以防止底层页面在显示/隐藏情态动词时左/右跳转。
body {
// STOP MOVING AROUND!
overflow-x: hidden;
overflow-y: scroll !important;
}
这个答案是x-post。
我刚才是这样做的……
$('body').css('overflow', 'hidden');
但当滚轮消失时，它将所有东西都正确移动了20px，所以我添加了
$('body').css('margin-right', '20px');
就在后面。
对我有用。
这是
body.modal-open {
overflow: hidden !important;
}
2017年11月Chrome引入了一个新的css属性
overscroll-behavior:包含;
这解决了这个问题，尽管在编写时跨浏览器支持有限。
有关详细信息和浏览器支持，请参阅下面的链接
https://developer.mozilla.org/en-US/docs/Web/CSS/overscroll-behavior https://developers.google.com/web/updates/2017/11/overscroll-behavior
