Question

我有以下代码示例我想在fancybox中打开视频，它几乎可以在所有浏览器中正常工作，除非我尝试在IE 8标准模式下测试它。

它在IE 9及以上版本中运行良好。

基于this solution我添加了以下代码行，但这并不能使其工作iframe: { preload: false }

HTML减速代码为

<!DOCTYPE html >
    <html lang="en">
    <head id="Head1" runat="server">
    <title></title>
    .........

示例代码

<div class="video-icon">
  <a href="http://www.youtube.com/embed/CR0AXNtwqZE?autoplay=1" class="fancybox-video"><img src="coorporate-video-icon.jpg"/></a>
</div>


             $("a.fancybox-video").fancybox({
                width: 600,
                height: 440,
                closeClick: true,
                hideOnOverlayClick: true,
                type: 'iframe',
                iframe: { preload: false // fixes issue with iframe and IE
                }
            });

我不确定是什么打破了它我无法创建一个小提琴的例子，因为小提琴在IE 8中不起作用在这方面的任何帮助都表示赞赏。

更新：我尝试使用fancybox版本2.1.3，但我仍面临同样的问题..

Answer 1

it doesn't work并没有真正说出问题所在。

如果它甚至不适用于v2.1.3，那么您可能还有其他问题。这是您对IE进行故障排除的检查清单：

确保您有一个正确的DOCTYPE，而DOCTYPE是您的html文档的第一行，因此IE不会切换到怪癖模式。
确保将自定义脚本包装在.ready()方法中。
确保使用正确的fancybox选项
确保在最后一个选项
检查其他脚本冲突（其他脚本的语法错误可能会阻止fancybox工作）
确保您没有任何其他js错误。检查IE未显示此图标（浏览器的左下角）：

否则，这个html

<a href="http://www.youtube.com/embed/CR0AXNtwqZE?autoplay=1" class="fancybox-video"><img src="coorporate-video-icon.jpg"/></a>

和这个jQuery代码，在IE [7-9]中使用fancybox v1.3.4都可以正常工作：

jQuery(document).ready(function ($) {
    $("a.fancybox-video").fancybox({
        width: 600,
        height: 440,
        hideOnContentClick: true, // closeClick: true, // this for v2.x
        hideOnOverlayClick: true,
        type: 'iframe'
    });
}); // ready

请参阅http://www.picssel.com/playground/jquery/youtubeEmbedIframe_07jan14.html

上的DEMO

fancybox-1.3.4在iE8中不起作用

1 个答案: