当有两个锚点在同一页面上打开相同的画廊时，如何防止显示相同的图像？

Question

我有一个页面，有两种方法可以打开在fancybox 2中打开的图像/视频库。

问题在于，因为有两个链接用第一个图像打开图库的开头，所以第一个图像在图库中显示两次。

以下是我的示例http://www.londonsitedesign.co.uk/test.html

如何阻止第一张图片在图库中显示两次？

Answer 1

如果第一个链接只启动fancybox图库，那么它不需要fancybox 类（例如，href属性）

您实际上可以使用不同的类（例如fancyboxLauncher）

<a class="fancyboxLauncher" href="#" rel="falling">Slideshow</a>

...并将click事件绑定到它，如：

$(".fancyboxLauncher").on("click", function(){
    $(".fancybox").eq(0).trigger("click");
    return false;
});

...请注意，我们使用方法.eq(0)从第一个项目中触发库，否则它将从最后一个项目开始。另请注意.on()需要jQuery v1.7 +

您仍然需要为fancybox图库提供此代码

$(".fancybox").fancybox({
    // API options here
});

检查 JSFIDDLE