Question

我有一个包含4个fancybox（v.2）画廊的页面，当我点击第一个画廊时，他绕过页面上的所有画廊，这很糟糕。所以我想给每个画廊一个不同的“rel”属性（rel =“gallery1”，rel =“gallery2”，rel =“gallery3”......）。所以我需要计算这些画廊并给他们数字。我的代码：

$(document).ready(function() {
$(".fancybox")
    .attr('rel', 'gallery')
    .fancybox({
        openEffect  : 'none',
        closeEffect : 'none',
        padding : 0,
        loop : false
});

}）;

Answer 1

假设每个图库都在<div class="post">之内：

<!-- first gallery -->
<div class="post">
    <a class="fancybox">...</a>
    <a class="fancybox">...</a>
</div>

<!-- second gallery -->
<div class="post">
    <a class="fancybox">...</a>
    <a class="fancybox">...</a>
</div>

您只需使用.each( function(index, element) )循环.post元素。使用每个.post索引来构建图库标识符，并在选择.post元素时将每个.fancybox元素用作jQuery selector context：

$(document).ready(function() {
    $(".post").each(function(idx, elm) {
        $(".fancybox", elm)
            .attr('rel', 'gallery' + idx)
            .fancybox({
                // ...
            });
    });
});
...

$(".fancybox", elm)告诉jQuery查找fancybox类的元素，但只匹配elm后代的元素（这里是{的当前.post元素{1}}循环）。

根据fancybox的工作原理，您可以在.each之外移动.fancybox()来电：

each

将各种“rel”属性添加到fancybox画廊

1 个答案: