image - 为 fancybox 图片库生成锚点和图片标签

Question

我有一个简单的 html 页面，我想用fancybox 为它制作一个非常简单的画廊。这是一张图片的代码：

<a class="gallery" href="img/83.jpg"><img src="img/83k.jpg" alt="" /></a>

问题是，我有 400 个，我必须让它连续，比如：

<a class="gallery" href="img/84.jpg"><img src="img/84k.jpg" alt="" /></a>
<a class="gallery" href="img/85.jpg"><img src="img/85k.jpg" alt="" /></a>
etc...

手工编码会很痛苦。我怎样才能生成所有这些？

谢谢！

Answer 1

创建一个要在其中生成画廊的容器，例如：

<div id="galleries"></div>

然后使用此代码：

$(document).ready(function(){
 var i = 83; // select your initial number
 for (i=83; i<=483; i++){ // loop as many images as you need
  $("div#galleries").append('<a href="img/' + i + '.jpg" class="fancybox" rel="gallery"><img src="img/' + i + 'k.jpg" alt="" /></a>');
 } // for
// and set your fancybox script afterwards
 $('.fancybox').fancybox({
  // fancybox options
 }); // fancybox
}); //ready