Question

我正在为我的图片库使用fancybox，我创建了一个重复的页面，但我添加了youTube链接来显示视频而不是图像文件，但是当我点击缩略图时，视频不会加载。

js：

$("a.fancy").fancybox({
    'overlayOpacity' : 0.7,
    'overlayColor' : '#000',
    'titlePosition' : 'over',
    'onComplete' : function () {
        $("#fancybox-wrap").hover(function () {
            $("#fancybox-title").show();
        }, function () {
            $("#fancybox-title").hide();
        });
    }
});

html：

<a href="https://www.youtube.com/embed/7h4o08e-uLw" class="fancy" rel="macro-group">youtube</a>
<a href="https://www.youtube.com/watch?v=stPqD4KOT9c&noredirect=1" class="fancy" rel="macro-group">

http://jfastudio.com/video-gallery.html

Answer 1

你要做的是：

将所有youtube的URL转换为以下格式：

https://www.youtube.com/embed/{video id}?{first trailing parameter}&{second trailing parameter}

将类 iframe添加到现有的锚类，如

<a href="{URL}" class="fancy iframe" ...

参见 JSFIDDLE

注意：这适用于fancybox v1.3.4。

修改

如果使用fancybox v2.x，请改为添加 class fancybox.iframe。

是的：

class="fancy fancybox.iframe"

......会是正确的。

Fancybox没有加载youtube视频

1 个答案: