0

我将Lightview与 WordPress 一起使用，并尝试为 WP 画廊提供必要的 rel 和类。默认图库标记类似于：

<div id="gallery-1" class="gallery galleryid-1">
    <dl class="gallery-item">
       <dt class="gallery-icon">
       <a href="image-link"><img src="xxx" /></a>
       </dt>
    </dl>
    <dl class="gallery-item">
       <dt class="gallery-icon">
       <a href="image-link"><img src="xxx" /></a>
       </dt>
   </dl>
</div>

使用 jQuery，我需要在链接上放置一个类（以触发 Lightview）和一个属性（在查看时对它们进行分组）。我可以得到简单的部分：

$(".gallery-icon a").attr('class','lightview');
$(".gallery-icon a").attr('data-lightview-group','group');

有用。class="lightview" 激活，并且 data-lightview-group 属性将所有图像保存在单个组“组”中以获得最佳导航。这样，原始代码变成这样：

<div id="gallery-1" class="gallery galleryid-1">
    <dl class="gallery-item">
       <dt class="gallery-icon">
       <a href="image-link" class="lightview" data-lightview-group="group"><img src="xxx" /></a>
       </dt>
    </dl>
    <dl class="gallery-item">
       <dt class="gallery-icon">
       <a href="image-link" class="lightview" data-lightview-group="group"><img src="xxx" /></a>
       </dt>
    </dl>
</div>

但如果有一长页包含多个画廊，它们会被合并，因为所有链接都将具有相同的“data-lightview-group”。

有一种方法可以从每个画廊获取 id 并将它们用作此 data-lightview-group 属性的值吗？或者任何其他方法在每个画廊的所有链接中都具有独特的价值？

4

2 回答 2

0

尝试使用.each喜欢

$(".gallery-icon a").each(function(){
     $(this).attr('data-lightview-group','group');
     $(this).attr('class','lightview');
     //Better to use addClass like
     -->$(this).addClass('lightview');
});

如果你想将 id 合并到 data-lightview-group 添加这个

var this_group = 'group'+$(this).attr('id');
$(this).attr('data-lightview-group',this_group);
于 2013-05-25T04:32:54.760 回答
0

试试这个为每个画廊分配不同的组名：

// for each gallery
$('.gallery').each(function() {

    // add lightview class
    $(this).find(".gallery-icon a").attr('class','lightview');

    // set a unique group name (group-<id of this galley>)
    $(this).find(".gallery-icon a").attr('data-lightview-group', 'group-' + $(this).attr('id'));
});
于 2013-05-25T04:35:09.953 回答