jquery - Fancybox 如何确定图库中的下一张图片？

Question

fancybox 如何确定画廊中的“下一个”或“上一个”图像？

我有一个页面，上面有垂直排列的照片，我想了解 fancybox 的行为。

Answer 1

Fancybox 选择 DOM 中图像上的所有链接，按您的 CSS 选择器排序。

更新：样本

<h1> gallery 1</h1>
<a href="urltodetail1.jpg" rel="gallery1"><img src="thumb1.jpg></a>
<a href="urltodetail2.jpg" rel="gallery1"><img src="thumb2.jpg></a>
<a href="urltodetail3.jpg" rel="gallery1"><img src="thumb3.jpg></a>

<h1> gallery 2 </h1>
<a href="urltodetail4.jpg" rel="gallery2"><img src="thumb4.jpg></a>
<a href="urltodetail5.jpg" rel="gallery2"><img src="thumb5.jpg></a>
<a href="urltodetail6.jpg" rel="gallery2"><img src="thumb6.jpg></a>

$("a[rel=gallery1],a[rel=gallery2]").fancybox();

http://jsfiddle.net/PfaXm/

Answer 2

Fancybox 通过使用 .fancybox() 定位的元素上的 'rel' 属性将画廊组合在一起。

您可以使用不同的 'rel' 值指定多个画廊。

您的画廊将按照与 jQuery 的选择相同的顺序出现。