javascript - 禁用网页上的所有滚动

标签 javascript jquery ios css html

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

我正在使用

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');
    });
});

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

这不是一个完美的解决方案,因为您可以“抛出”页面,但当抛出完成后它会返回到所需位置(因为随后将触发窗口滚动事件)。这是因为 iOS 浏览器为了性能去掉了很多事件。 setTimeout 和 setInterval 函数也不会在页面被抛出时触发,循环也不是一个选项!

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

关于javascript - 禁用网页上的所有滚动,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17596938/

相关文章:

javascript - 代理未按预期工作

jquery - 单击 div 来选中/取消选中复选框

在类中创建的 Javascript 鼠标事件监听器

javascript - 如何处理一个网站的 jmeter,该网站具有用 JavaScript 制作的表单,该表单会在下一个和上一个上回发

javascript - ReactJS:状态上的 Switch 语句与显式状态声明

php - Symfony2 Controller 和 Javascript 参数传递

ios - 以编程方式更改中心 X/Y 对齐约束的乘数

ios - UIViewController 应该控制 UIView 的动画吗?

ios - PushSharp Push 在停止之前不会处理队列

javascript - 如何基于 Google Books API 表示和自动完成建议的 JSON?