通过手动链接打开多个Fancybox图库

我试图通过手动调用html中的图库而不是通过jquery选项来转换我如何打开fancybox中提供的解决方案？ 为了将它应用到几个画廊，但无法使其正常运行。

我所拥有的是具有以下属性的几个链接：

Album 1 Album 2 

等等

这些应该适用于各自支持Fancybox的相册，例如：

和

Fancybox查找.image-show类，并在单击图像本身时正常工作。

以下jQuery代码应该将相册标题链接到各自相册中的第一张图片：

  $('.open-album').click(function(e) { var el, id = $(this.element).data('open-id'); if(id){ el = $('.image-show[rel=' + id + ']:eq(0)'); e.preventDefault(); el.click(); } }); 

如您所见，目标是从相册标题中获取data-open-id并使用它打开第一个Fancybox项目，其值为rel属性。 唉，它不起作用。 什么可能出错？ 非常感谢您的帮助！

提前致谢！

Answer 1

我假设你将选择器.image-show绑定到fancybox，不是吗？

 $(".image-show").fancybox(); 

如果是这样，你的代码的问题是$(this.element)应仅在fancybox回调中使用 ，但由于你使用常规的jQuery方法（ .click() ），那么你应该引用当前元素，如$(this)

 $('.open-album').click(function(e) { var el, id = $(this).data('open-id'); if(id){ el = $('.image-show[rel=' + id + ']:eq(0)'); e.preventDefault(); el.click(); } }); 

请参阅JSFIDDLE