Question

使用Fancybox到play youtube videos in a modal box。

我的问题是我不断收到“请求的内容无法加载。请稍后再试。”

模式框弹出，所以我知道脚本正在运行，这可能是我的API调用的问题...这是我的电话：

<script type="text/javascript">
$(document).ready(function() {

            /* This is basic - uses default settings */

            $("a.fancybox").fancybox({
                'hideOnContentClick': true
            });

            /* This is a non-obtrustive method for youtube videos*/

            $("a[rel=fancyvideo]").fancybox({
                overlayShow: true,
                frameWidth:640,
                frameHeight:360,
            });
        });
</script>

Answer 1

<a>和class="fancybox"是否有rel="fancyvideo"个？如果你这样做，你将把Fancybox绑定到那些元素两次，而Fancybox可能不喜欢这样。试着拿出这个：

$("a.fancybox").fancybox({
    'hideOnContentClick': true
});

看看第二个就会发生什么。

更新：奇怪。该演示（http://chadly.net/demos/video-lightbox.html）产生的HTML与您的页面不同，该演示构建了一个<object data=...>，但您的构建<object><embed src="youtube-url">。你说的是：

type: 'swf'

在你的Fancybox绑定中，这就是<object><embed>...</embed></object>内容的来源。但是，href点在普通的YouTube视频观看HTML网页上，而href最终会成为src的{{1}}属性。嵌入YouTube视频的网址与视频的HTML网页不同，这可能是您问题的根源。

尝试替换看起来像这样的<embed>：

href

就像这样：

http://www.youtube.com/watch?v=QmVvgSfdmJQ

第一个是YouTube的纯HTML页面，第二个是可嵌入的SWF。

更新2 ：您正在使用的示例适用于Fancybox 1.0.0，但您使用的是1.3.4,1.0.0对YouTube有一些特殊检查，但不存在于更高版本：

http://www.youtube.com/embed/QmVvgSfdmJQ

从1.0.0开始，//... } else if (url.match(/youtube\.com\/watch/i)) { //...之后的代码将HTML网页网址（例如else if）重写为旧的可嵌入SWF网址（例如http://www.youtube.com/watch?v=QmVvgSfdmJQ）。此版本问题还解释了为什么演示生成的HTML不同于您的。

所以，除了其他一切之外，你还有一些版本问题。

Answer 2

检查您是否包含 jquery.fancybox-media.js

<script type="text/javascript" src="jquery.fancybox-media.js?v=1.0.0"></script>

Answer 3

看起来您的代码可能稍微关闭

<script type="text/javascript">
    $(document).ready(function() {
        $("a[@rel*=fancyvideo]").fancybox({
            overlayShow: true,
            frameWidth:640,
            frameHeight:360
        });
    });
</script>

http://chadly.net/post/2009/01/29/Lightbox-for-YouTube-Videos.aspx

Answer 4

使用此示例不要忘记href

<a class="fancybox" href="your path for image or other">
  <img src="imagepath">
</a>

Fancybox返回“无法加载请求的内容。请稍后再试。”

4 个答案: