使用Blueimp的引导图像库无法正常工作

Question

我想在我的引导框架网站上添加图像库功能。

我正在使用Blueimp作为图库。 但问题是它不显示图像只显示下一个和上一个按钮。 请帮帮我。

这是我的HTML代码：

<div id="blueimp-gallery" class="blueimp-gallery"> 
    <!-- The container for the modal slides --> 
    <div class="slides"></div> 
     <!-- Controls for the borderless lightbox --> 
      <h3 class="title"></h3> 
      <a class="prev">‹</a> 
       <a class="next">›</a> 
      <a class="close">×</a> 
      <a class="play-pause"></a> 
      <ol class="indicator"></ol> 
      <!-- The modal dialog, which will be used to wrap the lightbox content --> 
     <div class="modal fade"> 
      <div class="modal-dialog"> 
       <div class="modal-content"> 
        <div class="modal-header"> 
         <button type="button" class="close" aria-hidden="true">&times;</button> 
         <h4 class="modal-title"></h4> 
         <div id="links"> 
          <a href="images/1.jpg" title="Banana" data-gallery> 
          <img src="images/thumbnails/1.jpg" alt="Banana"> 
          </a> 
          <a href="images/2.jpg" title="Apple" data-gallery> 
          <img src="images/thumbnails/2.jpg" alt="Apple"> 
          </a> 
          <a href="images/3.jpg" title="Orange" data-gallery> 
          <img src="images/thumbnails/3.jpg" alt="Orange"> 
          </a> 
          </div> 

        </div> 
       <div class="modal-body next"></div> 
        <div class="modal-footer"> 
         <button type="button" class="btn btn-default pull-left prev"> 
         <i class="glyphicon glyphicon-chevron-left"></i> 
         Previous 
         </button> 
         <button type="button" class="btn btn-primary next"> 
         Next 
         <i class="glyphicon glyphicon-chevron-right"></i> 
         </button> 
       </div> 
      </div> 
     </div> 
    </div> 

Answer 1

把div元素与#LINK ID整个代码之外。

这里是引导blueimp帮助：

https://github.com/blueimp/Bootstrap-Image-Gallery