Question

Hello StackOverflowers，

我遇到了fancybox的问题，我希望在1个图库中拥有图片和2个youtube视频。

它会加载并显示我的图片，但它不会将我的视频推入图库。很难解释so I will link the page where i have this problem here

我按以下方式加载脚本：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
    <script type="text/javascript" src="/js/jquery.fancybox.js"></script>
    <link rel="stylesheet" type="text/css" href="/style/jquery.fancybox.css" media="screen" />
    <script type="text/javascript" src="/js/jquery.fancybox-thumbs.js"></script>
    <script type="text/javascript" src="/js/jquery.fancybox-media.js"></script>
    <link rel="stylesheet" type="text/css" href="/style/style.css">
    <link rel="stylesheet" type="text/css" href="/style/jquery.fancybox-thumbs.css" />
    <link rel="stylesheet" type="text/css" href="/style/3dsmax.css" />

我正在使用一些助手：

$('a.fancybox').fancybox({
        prevEffect : 'none',
        nextEffect : 'none',

        closeBtn  : true,
        arrows    : true,
        nextClick : true,


        helpers : {
            thumbs : {
                width  : 50,
                height : 50
            }
        }
    });

Answer 1

根据fancybox的文档：

您可以通过添加classname（fancybox.image，fancybox.iframe等）直接指定类型

您还应该使用视频的嵌入网址，您的<a>标记现在应如下所示：

<a class="fancybox hidden fancybox.iframe" data-fancybox-group="gallery4" href="https://www.youtube.com/embed/8so-fsGxXZ8"><img src="./Chris Holstein's Portfolio_files/cdpreview.jpg"></a>
<a class="fancybox hidden fancybox.iframe" data-fancybox-group="gallery4" href="https://www.youtube.com/embed/USNfjkTny78"><img src="./Chris Holstein's Portfolio_files/doospreview.jpg"></a>

顺便说一句，你应该避免使用带空格的文件名，有时会导致奇怪的行为......

Fancybox图像和youtube在1个图库中

1 个答案: