FancyBox with iframe misrendering

Question

当用户点击缩略图时，我将fancybox添加到页面以显示youtube或vimeo视频。当弹出窗口打开时，一切看起来都很好，但如果在页面上滚动而不是停留在固定位置，则弹出式覆盖页面和弹出窗口本身会随页面一起滚动。尽管iframe实际上停留在固定位置。它也会导致渲染工件显示为重复的弹出窗口。

看起来它实际上是某种渲染错误，因为工件并不存在。为了解决这个问题，我在javascript中添加了一个滚动监听器，它在主体的顶部添加并删除1px的填充。这导致浏览器重画屏幕，我猜测，重新定位叠加/弹出并清理工件。

这似乎不是一个适当的解决方案，所以我正在寻找替代解决方案来防止此问题或至少一个链接到某个地方确认它是一个渲染问题。

我在mac上使用了最新版本的chrome中的fancybox2。

Answer 1

我的解决方法

options['fixed'] = false; 
    options['afterShow'] = forceUpdateUI; 
    options['afterClose'] = forceUpdateUI; 

    $.fancybox(
     "hello world",options 
    ); 


} 
function forceUpdateUI(){ 
    $('body').addClass('dummy-class'); 
    setTimeout(function(){ 
     $('body').removeClass('dummy-class'); 
    },500); 
} 

    .dummy-class{ 
    padding-top:1px; 
    }