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;
    }
},

这会在背景和弹出窗口之间创建叠加层，但背景仍然可滚动。删除滚动条实际上不是解决方案，因为我使用触摸和滑动。

Answer 1

如果你正在使用jQueryMobile，只要你想阻止页面滚动就使用这段代码：

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

然后使用此代码再次滚动：

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

触摸屏滚动禁用

1 个答案: