Question

霍拉，我正在使用JIG来创作我的画廊。画廊具有以下结构：

    <div id="jig1" class="justified-image-grid jig-eec93aceb26f618c747e9fe2abded7ce jig-preset-c1" style="width: 1278px;">
  <div class="jig-imageContainer jig-contentID-ML-1191">
    <div class="jig-overflow" style="opacity: 1; width: 658px; height: 438px;">
      <a class="jig-link lulz jig-loaded" rel="jig[2]" test="lala" href="http://127.0.0.1/wp/wp-content/uploads/2014/11/untitled-imgp1913.jpg">
        <img src="http://127.0.0.1/wp/wp-content/plugins/justified-image-grid/timthumb.php?src=http%3A%2F%2F127.0.0.1%2Fwp%2Fwp-content%2Fuploads%2F2014%2F11%2Funtitled-imgp1913.jpg&amp;h=1040&amp;w=1560&amp;q=45&amp;f=.jpg" width="658" height="439" style="width: 658px; height: 439px; margin-top: 0px;"></a>
      </div>
    </div>
    <div class="jig-imageContainer jig-contentID-ML-1190 jig-last">
      <div class="jig-overflow" style="opacity: 1; width: 614px; height: 438px;">
        <a class="jig-link lulz jig-loaded" rel="jig[2]" test="lala" href="http://127.0.0.1/wp/wp-content/uploads/2014/11/untitled-imgp1912.jpg">
          <img src="http://127.0.0.1/wp/wp-content/plugins/justified-image-grid/timthumb.php?src=http%3A%2F%2F127.0.0.1%2Fwp%2Fwp-content%2Fuploads%2F2014%2F11%2Funtitled-imgp1912.jpg&amp;h=1040&amp;w=1456&amp;q=45&amp;f=.jpg" width="614" height="439" style="width: 614px; height: 439px; margin-top: 0px;"></a>
        </div>
      </div>
        </div>

...

    <div id="jig2" class="justified-image-grid jig-eec93aceb26f618c747e9fe2abded7ce jig-preset-c1" style="width: 1278px;">
  <div class="jig-imageContainer jig-contentID-ML-1191">
    <div class="jig-overflow" style="opacity: 1; width: 658px; height: 438px;">
      <a class="jig-link lulz jig-loaded" rel="jig[2]" test="lala" href="http://127.0.0.1/wp/wp-content/uploads/2014/11/untitled-imgp1913.jpg">
        <img src="http://127.0.0.1/wp/wp-content/plugins/justified-image-grid/timthumb.php?src=http%3A%2F%2F127.0.0.1%2Fwp%2Fwp-content%2Fuploads%2F2014%2F11%2Funtitled-imgp1913.jpg&amp;h=1040&amp;w=1560&amp;q=45&amp;f=.jpg" width="658" height="439" style="width: 658px; height: 439px; margin-top: 0px;"></a>
      </div>
    </div>
    <div class="jig-imageContainer jig-contentID-ML-1190 jig-last">
      <div class="jig-overflow" style="opacity: 1; width: 614px; height: 438px;">
        <a class="jig-link lulz jig-loaded" rel="jig[2]" test="lala" href="http://127.0.0.1/wp/wp-content/uploads/2014/11/untitled-imgp1912.jpg">
          <img src="http://127.0.0.1/wp/wp-content/plugins/justified-image-grid/timthumb.php?src=http%3A%2F%2F127.0.0.1%2Fwp%2Fwp-content%2Fuploads%2F2014%2F11%2Funtitled-imgp1912.jpg&amp;h=1040&amp;w=1456&amp;q=45&amp;f=.jpg" width="614" height="439" style="width: 614px; height: 439px; margin-top: 0px;"></a>
        </div>
      </div>
        </div>

可以使用ID标签识别图库，例如＆＃34; jig1，jig2等......＆＃34;

现在如何为每个画廊调用灯箱？

这仅适用于第一个图库

$('.justified-image-grid').lightGallery({
selector: '.lulz'
});

或者我可以使用：

$('#jig1').lightGallery({
selector: '.lulz'
});

有趣的是，即使这样也没有加载第二个画廊的灯箱？

$('#jig2').lightGallery({
selector: '.lulz'
});

多个合理的图像网格库 - 使用lightgallery定制灯箱调用/标记

0 个答案: