怎么把fancy box转换成fancy box gallery？

Question

我创建了这个网站，并使用精美的框来显示效果图像。 我想将此图像转换为图像库。 我在我的网站中将图片放置在这样的代码中：

<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的敌人运行花哨的盒子：

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

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

在此存在一个精美的盒子画廊样品。 我想创建一个像这样的图片库。 这个怎么做？

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>