Question

我使用这样的灯箱http://www.leandrovieira.com/projects/jquery/lightbox/这里是使用

的例子

<script type="text/javascript">
$(function() {
    // Use this example, or...
    $('a[@rel*=lightbox]').lightBox(); // Select all links that contains lightbox in the attribute rel
    // This, or...
    $('#gallery a').lightBox(); // Select all links in object with gallery ID
    // This, or...
    $('a.lightbox').lightBox(); // Select all links with lightbox class
    // This, or...
    $('a').lightBox(); // Select all links in the page
    // ... The possibility are many. Use your creative or choose one in the examples above
});
</script>

我想分组图片，所以我写这样的网址<a href='' rel='lightbox[group1]'></a>和<a href='' rel='lightbox[group2]'></a>

我怎么运行这个？ $('a[@rel*=lightbox]').lightBox();不起作用，或者可能是另一种方法？

Answer 1

如果您有很多照片，我找到了简单的解决方案，您不必为每个添加rel。只需用div级别环绕图像，例如收藏夹组

示例：

<强> HTML

<div class="lightbox-group" id="first">
<a href="..."><img src="..." /></a>
<a href="..."><img src="..." /></a>
<a href="..."><img src="..." /></a>
</div>

<div class="lightbox-group" id="second">
<a href="..."><img src="..." /></a>
<a href="..."><img src="..." /></a>
<a href="..."><img src="..." /></a>
</div>

<强> JS

$(document).ready(function() {
    $('div.lightbox-group').each(function(){
        $(this).find('a').lightBox();                     
     });    
});

Answer 2

如果你有这样的HTML标签：

<a href='' rel='group1'></a>和<a href='' rel='group2'></a>

您可以使用：

$('a[@rel=group1]').lightBox();和$('a[@rel=group2]').lightBox();

Answer 3

只需在您的所有图片组中写下rel=lightbox

并尝试

      $('a[@rel*=lightbox]').lightBox();

参见 Here

* jQuery（'[attribute =“value”]'）：** 选择具有的元素带有值的指定属性包含给定的子字符串。

Answer 4

您必须修改here之类的插件。这很简单，但就像一个魅力。

jquery灯箱组图片

4 个答案: