1

我在页面中添加了 fancybox 以在用户点击缩略图时显示 youtube 或 vimeo 视频。当弹出窗口打开时，一切看起来都很好，但是如果您在页面上滚动而不是停留在固定位置，则弹出窗口叠加层和弹出窗口本身会随着页面滚动。iframe 实际上保持在它的固定位置。它还会导致渲染工件像重复的弹出窗口一样出现。

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

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

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

4

1 回答 1

0

我的解决方法

    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;
    }
于 2013-12-18T15:02:51.930 回答