显示弹出窗口时防止背景滚动 [英] Prevent Background Scrolling When Displaying Popup

问题描述

我有一个显示在弹出窗体中的窗体。加载后，背景变灰，但用户仍然可以上下滚动背景内容。

如何防止背景滚动？

此处示例

email this quote链接位于pdf截图的右侧。

谢谢！
Joe

解决方案

一种选择是临时设置溢出属性为隐藏放在 body 上，这将消除滚动条，但是当页面变为闪烁时调整。

另一种选择是使用 $（window）.scroll（）事件并返回false从那里。这也会导致一些闪烁，因为浏览器不会对返回的错误语句做出快速反应。

最好的办法是将您的点击事件处理程序移动到单独的文件，然后做绑定：

  $（function（）{
 $（'。emailPost'）。点击（function（）{
 $（window）.scroll（function（）{return false;}）; 
 pageTracker._trackPageview（'/ onclick / emailquote'）; 
}）; 
}）; 
  

这应该防止页面滚动。请记住，在对话框关闭后删除绑定，否则该页面将无法再滚动！您可以使用以下方式删除绑定：

  $（window）.unbind（'scroll'）; 
  

I have a form that is displayed in a popup. After loading, the background is grayed out, but the user can still scroll the background content up and down.

How do I prevent the background from scrolling?

Example here

the 'email this quote' link to the right of the pdf screenshot.

Thanks! Joe

解决方案

One option is to temporarily set the overflow property to hidden on body, that will get rid of the scroll bars but causes a small flicker when the page is adjusted.

The other choice is to tap onto the $(window).scroll() event and return false from there. That will also cause a bit of flicker as the browser doesn't react that fast to the return false statement.

Your best bet is to move your click event handlers to a separate file and do the binding there:

$(function() {
    $('.emailPost').click(function() {
        $(window).scroll(function() { return false; });
        pageTracker._trackPageview('/onclick/emailquote');            
    });
});

That should prevent a page from scrolling. Remember to remove the bind after the dialog closes, otherwise the page won't be scrollable anymore! You can remove binds using:

$(window).unbind('scroll');

这篇关于显示弹出窗口时防止背景滚动的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！