文章/答案/技术大牛

发布

社区首页 >问答首页 >向fancybox图库添加各种"rel“属性

问向fancybox图库添加各种"rel“属性
EN

Stack Overflow用户

提问于 2013-12-27 14:04:10

回答 1查看 892关注 0票数 0

我有一个带有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
});

})；

jquery

fancybox-2

回答 1

Stack Overflow用户

回答已采纳

发布于 2013-12-27 14:06:39

假设每个图库位于一个<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索引构建库标识符，并在选择.fancybox元素时使用每个.fancybox元素作为jQuery选择器上下文：

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

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

根据fancybox的工作方式，您可以将.fancybox()调用移到each之外

$(".post").each(function(idx, elm) {
    // assign `rel` values as above...
});

$(".fancybox").fancybox({
    // ...
});

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/20802062

复制

相似问题

问向fancybox图库添加各种"rel“属性
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问向fancybox图库添加各种"rel“属性EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问向fancybox图库添加各种"rel“属性
EN