jquery lightbox 组图像

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>

我想对图像进行分组，所以我写了这样的url <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();                     
     });    
});