使用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