jquery fancybox firefox维度问题

Question

我正在使用jquery fancybox在我的网站上显示叠加视频。以下jquery代码在Chrome中运行良好，但在Firefox中，视频会减少，并且容纳视频的容器的尺寸会减小。以下是jquery代码

$('.fancybox-media').fancybox({
    'type': 'iframe',
    'width': 800,
    'height': 580,
    'autoDimensions':   false,
    helpers     : {
         media: true
    }
});

以下是chrome和firefox的图片

任何有关这方面的帮助都将受到赞赏。

Answer 1

如果您使用type : "iframe"，则可能不需要使用media helpers（实际上将内容移至iframe内）。

此外，如果您希望fancybox保持固定尺寸，则需要添加fitToView: false，否则将调整fancybox以适应较小屏幕的视口。

此外，您可能需要禁用iframe preload以避免在内容未完全加载时出现一些已知问题（浏览器可能会以不同方式处理大小计算）

所以这段代码应该可以在Firefox，Chrome甚至IE7 +中实现：

$('.fancybox-media').fancybox({
    type: 'iframe',
    width: 800,
    height: 580,
    // add
    fitToView: false,
    iframe : {
      preload : false
    }
});