我想让我的身体在使用鼠标滚轮时停止滚动,而我的网站上的Modal(来自http://twitter.github.com/bootstrap)是打开的。

当模式被打开时,我试图调用下面的javascript片段,但没有成功

$(window).scroll(function() { return false; });

AND

$(window).live('scroll', function() { return false; });

请注意,我们的网站放弃了对IE6的支持,IE7+需要兼容。


当前回答

你可以试着设置body size为window size, overflow:当modal打开时隐藏

其他回答

我使用这个香草js函数添加“模态打开”类的身体。(根据smhmic的回答)

function freezeScroll(show, new_width)
{
    var innerWidth = window.innerWidth,
        clientWidth = document.documentElement.clientWidth,
        new_margin = ((show) ? (new_width + innerWidth - clientWidth) : new_width) + "px";

    document.body.style.marginRight = new_margin;
    document.body.className = (show) ? "modal-open" : "";
};

我刚才是这样做的……

$('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

对于那些使用SharePoint 2013的人,有一个小提示。主体已经有overflow: hidden。你要找的是设置overflow:隐藏在id为s4-workspace的div元素上,例如。

var body = document.getElementById('s4-workspace');
body.className = body.className+" modal-open";