禁用网页上的所有滚动

Rob*_*osh 5 javascript css jquery html5 ios

我想知道是否可以禁用网页上的所有滚动.

我目前正在使用

html, body { overflow:hidden; }
Run Code Online (Sandbox Code Playgroud)

问题是这在iOS设备上不起作用,如果您按住鼠标滚轮并向下拖动它也可以滚动,所以这似乎是一个非常糟糕的解决方案

有没有办法禁用所有设备上的所有滚动方法,然后重新启用它?

ror*_*cko 6

我有这个完全相同的问题,我用以下内容修复它;

var disableScroll = false;
var scrollPos = 0;
function stopScroll() {
    disableScroll = true;
    scrollPos = $(window).scrollTop();
}
function enableScroll() {
    disableScroll = false;
}
$(function(){
    $(window).bind('scroll', function(){
         if(disableScroll) $(window).scrollTop(scrollPos);
    });
    $(window).bind('touchmove', function(){
         $(window).trigger('scroll');
    });
});
Run Code Online (Sandbox Code Playgroud)

触摸移动被绑定到窗口,因为在触摸移动完成之前不会触发窗口滚动事件,因此这样可以在iOS上获得更流畅的体验!

这不是一个完美的解决方案,因为你可以"抛出"页面,但是当投掷完成时它会返回到所需的位置(因为窗口滚动事件将被触发).这是因为iOS浏览器剥离了许多性能事件.也有setTimeout和setInterval函数在页面被抛出时不会触发,也不能选择循环!

看到这里http://jsfiddle.net/8T26k/