从Flickr将图像加载到Lightbox 2的更有效方法是什么？

Question

我正在使用Lightbox 2，我想知道你是否可以给我一些指示。现在这就是我添加图片的方式：

<a href="IMAGE URL GOES HERE" rel="lightbox[gallery1]" title="TITLE HERE"></a>
<a href="IMAGE URL GOES HERE" rel="lightbox[gallery1]" title="TITLE HERE"></a>
<a href="IMAGE URL GOES HERE" rel="lightbox[gallery1]" title="TITLE HERE"></a>
<a href="IMAGE URL GOES HERE" rel="lightbox[gallery1]" title="TITLE HERE"></a>
<a href="IMAGE URL GOES HERE" rel="lightbox[gallery1]" title="TITLE HERE"></a>
<a href="IMAGE URL GOES HERE" rel="lightbox[gallery1]" title="TITLE HERE"></a>
etc.......

Lightbox的想法是，rel中具有相同“gallery1”标记的所有图像都将显示在Lightbox库中。我的问题是我不想一次一个地向画廊添加这样的图像。有没有更快，更有效的方法来做到这一点？提前谢谢。

Answer 1

您可以将文件名放在数组中并在JS中循环它们。假设你有jQuery，试试这个。请注意，它取决于文件的路径。这是一个有效的fiddle。

HTML：

<ul id="photos-ul"></ul>

JS：

var fileNames = ["1","2","3"]; // put the filenames in an array and make the url correct in the loop
for (i=0; i < fileNames.length; i++){
    $('#photos-ul').append("<li><a href='http://flicker.com/photo" + fileNames[i] + "'>Photo " + fileNames[i] + "</a></li>"); 
}