触摸屏滚动禁用

Question

我的工作涉及创建一个触摸屏应用的帮助文件。通常情况下，页面是通过触摸可滚动的，这很好，但现在他们要求我创建一些可移动的弹出窗口，并且此操作会干扰触摸屏的滚动。有没有一种方法可以在弹出窗口出现时禁用背景的滚动？

我看过以下文章：防止显示弹出窗口时背景滚动。

但是 "$(window).scroll(function() { return false; });" 对我似乎不起作用。

我的应用在IE7的背景下使用，我现在使用的代码如下。

_overlay: function (status) {
    switch (status) {
        case 'show':
            $(window).scroll(function () {
                return false;
            });
            $.alerts._overlay('hide');
            $("BODY").append('<div id="popup_overlay"></div>');
            $("#popup_overlay").css({
                position: 'absolute',
                zIndex: 99998,
                top: '0px',
                left: '0px',
                width: '100%',
                height: $(document).height(),
                background: $.alerts.overlayColor,
                opacity: $.alerts.overlayOpacity
            });
            break;
        case 'hide':
            $(window).unbind('scroll');
            $("#popup_overlay").remove();
            break;
    }
},

这将在背景和弹出窗口之间创建一个叠加层，但背景仍然可以滚动。移除滚动条并不是一个真正的解决方案，因为我使用触摸和滑动。

- user3755807

Answer 1

如果您正在使用jQueryMobile，每当您想停止页面滚动时，请使用以下代码：

$(document).bind('touchmove', function(e) {
    e.preventDefault();
});

然后使用以下代码让它再次滚动：

$(document).unbind('touchmove');

- Amin Jafari

---

你好，jQueryMobile适用于HTML5。不幸的是，我所使用的应用程序使用的是HTML4和IE7。这使得使用较新的代码更加困难。我尝试将你的代码添加到我的应用程序中，但没有帮助。 - user3755807

你刚刚救了我的一命。谢谢。 - Dan Green-Leipciger