Fancybox 画廊弹出问题答案

【问题标题】：Fancybox gallery pop up issueFancybox 画廊弹出问题
【发布时间】：2013-02-18 08:13:13
【问题描述】：

我确定我为此选择了完美的标题，但是，如果有人能想出更好的标题，请随时编辑。无论如何，当您单击意味着打开一个弹出窗口的图像时，我在为我的画廊集成 jQuery 插件fancybox 时遇到了一个小问题。展示画廊click here

我之所以选择使用 iframe，是因为我希望画廊能够同时展示视频和图片。 iframe 是实现此目的的正确格式吗？

<script type="text/javascript">
$(document).ready(function() {
    $(".various").fancybox({
        minWidth    : 902,
        minHeight   : 505,
        fitToView   : true,
        width       : '50%',
        height      : '50%',
        closeClick  : true,
        openEffect  : 'fade',
        closeEffect : 'fade',
        type : 'iframe',
        preload: 'auto',
        helpers: {
            thumbs: {
             width   : 50,
             height  : 50
            } // closes thumbs
           } // closes helpers
    });
});

我正在使用插件Montage 来处理响应式元素。如果两个插件之间存在某种形式的冲突。有人可以纠正我哪里出错了。

【问题讨论】：

不应该有任何冲突，但据我所知，您缺少包含fancybox CSS文件（您只包含fancybox-thumbs css文件）......另一方面，你没有给图片指定type : "iframe"，你可以设置每个链接的内容类型

标签： javascript jquery html fancybox

【解决方案1】：

我最近尝试使用 fancybox 来显示图像和照片，但找不到合适的解决方案。相反，我使用了PrettyPhoto，我发现它非常好，有很多可定制的选项。如果您愿意/能够从 fancybox 切换，我建议您使用它。

要设置它，只需设置您的 PrettyPhoto 选择器

$("a[rel^='prettyPhoto']").prettyPhoto();

然后，对于您希望在图库中显示的图像和/或视频的每个链接，只需将属性（在方括号中为您的图库命名）添加到链接

rel="prettyPhoto[myGalleryName]"

【讨论】：