我想知道是否可以禁用网页上的所有滚动。
我目前正在使用
html, body { overflow:hidden; }
问题是这在 iOS 设备上不起作用,如果您按住鼠标滚轮并将其向下拖动,您也可以滚动,所以这似乎是一个非常糟糕的问题解决方案
有没有办法禁用所有设备上的所有滚动方法然后重新启用它?
我想知道是否可以禁用网页上的所有滚动。
我目前正在使用
html, body { overflow:hidden; }
问题是这在 iOS 设备上不起作用,如果您按住鼠标滚轮并将其向下拖动,您也可以滚动,所以这似乎是一个非常糟糕的问题解决方案
有没有办法禁用所有设备上的所有滚动方法然后重新启用它?
我遇到了同样的问题,我用以下方法修复了它;
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');
});
});
触摸移动绑定到窗口,因为在触摸移动完成之前不会触发窗口滚动事件,因此这可以在 iOS 上提供更流畅的体验!
这不是一个完美的解决方案,因为您可以“投掷”页面,但是当投掷完成时它将返回到所需的位置(因为随后将触发窗口滚动事件)。这是因为 iOS 浏览器为了性能而去掉了很多事件。setTimeout 和 setInterval 函数在页面被抛出时也不会触发,循环也不是一个选项!