如何将精美的盒子转换为精美的盒子画廊？

Question

我创建了this网站并使用精美的方框来显示效果。我想将此图像转换为图库。我在我网站上的图片被放入如下代码中：

<div class="col-md-4   to-animate popup text-center fadeInUp animated">
                    <br>
                    <a href="images/best-Exporter-91.jpg" class="fancybox">
                        <img src="images/best-Exporter-91.jpg" class="center-block img img-responsive"></a>
                    <h4 class="center-block">Best Exporter Award 2012</h4>
                </div>

我使用这个jquery foe run fancy box：

  /***************** Initiate Fancybox ******************/

    $('.fancybox').fancybox({
        padding: 4,
    });

在this中存在花式框库的样本。我想创建一个像这样的图库。怎么做？

Answer 1

尝试使用rel="gallery1"对图片进行分组：

<div class="col-md-4   to-animate popup text-center fadeInUp animated">
   <br>
   <a href="images/best-Exporter-91.jpg" class="fancybox" rel="gallery1">
   <img src="images/best-Exporter-91.jpg" class="center-block img img-responsive"></a>
   <h4 class="center-block">Best Exporter Award 2012</h4>

   <br>
   <a href="images/best-Exporter-91.jpg" class="fancybox" rel="gallery1">
   <img src="images/best-Exporter-91.jpg" class="center-block img img-responsive"></a>
   <h4 class="center-block">Best Exporter Award 2012</h4>

   <br>
   <a href="images/best-Exporter-91.jpg" class="fancybox" rel="gallery1">
   <img src="images/best-Exporter-91.jpg" class="center-block img img-responsive"></a>
   <h4 class="center-block">Best Exporter Award 2012</h4>
</div>