jquery - 当链接位于 内时，如何使用 PrettyPhoto 启用下一个/上一个

Question

我有一个带有以下标记的画廊:

<ul>
<li>
    <figure>
        <a href="myimg1.jpg" rel="prettyPhoto"><img src="thumb1.jpg" /></a>
        <figcaption>
        some stuff here
        </figcaption>
    </figure>
</li>
<li>
    <figure>
        <a href="myimg2.jpg" rel="prettyPhoto"><img src="thumb2.jpg" /></a>
        <figcaption>
        some stuff here
        </figcaption>
    </figure>
</li>
</ul>

据我所知，为了使自动下一个/上一个导航正常工作，图像链接需要在 DOM 中彼此并排。有什么简单的方法让它与上述结构一起工作吗？我查看了选项，但没有看到任何明显的东西。

Answer 1

我所做的就是修改图像的 rel 属性，因此:

<a href="myimg1.jpg" rel="prettyPhoto"><img src="thumb1.jpg" /></a>
<a href="myimg2.jpg" rel="prettyPhoto"><img src="thumb2.jpg" /></a>

变成这样:

<a href="myimg1.jpg" rel="prettyPhoto[gallery_name]"><img src="thumb1.jpg" /></a>
<a href="myimg2.jpg" rel="prettyPhoto[gallery_name]"><img src="thumb2.jpg" /></a>

这样做让我获得了下一个/上一个控件。我在漂亮照片home page上找到了详细信息。 .

我的 JavaScript 是这样的:

$(document).ready(function () {
    $("a[rel^='prettyPhoto']").prettyPhoto({
        theme: 'facebook',
        slideshow: 5000,
        autoplay_slideshow: false
    });
});