2015-12-10 74 views
2

我不知道爲什麼LightBox不工作。當我點擊圖像時,它會轉到頁面的鏈接,而不是讓「燈箱」淡入來顯示圖像。我console.logged並沒有得到任何錯誤消息。jQuery Lightbox2不工作

P畫廊|查看投資組合

<link rel="stylesheet" href="css/style.css"> 
    <link rel="stylesheet" href="dist/css/lightbox.css"> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
    <script src="js/script.js"></script> 
    <script src="dist/js/lightbox.js"></script> 

</head> 


     <section> 
      <div class="container"> 
       <h1 id="heading">All Projects</h1> 
       <ul id="gallery"> 
        <li class="design" ><a href="img/web1.jpg" data-lightbox="example-set" data-title="Project 1" data-desc="abc"><img src="img/web1.jpg"></a></li> 
        <li class="programming" ><a href="img/web2.jpg" data-lightbox="example-set" data-title="Project 1" data-desc="abc"><img src="img/web2.jpg"></a></li> 
        <li class="cms" ><a href="img/web3.jpg" data-lightbox="example-set" data-title="Project 1" data-desc="abc"><img src="img/web3.jpg"></a></li> 
        <li class="cms" ><a href="img/web4.jpg" data-lightbox="example-set" data-title="Project 1" data-desc="abc"><img src="img/web4.jpg"></a></li> 
        <li class="design cms programming" ><a href="img/web5.jpg" data-lightbox="example-set" data-title="Project 1" data-desc="abc"><img src="img/web5.jpg"></a></li> 
        <li class="design cms programming" ><a href="img/web6.jpg" data-lightbox="example-set" data-title="Project 1" data-desc="abc"><img src="img/web6.jpg"></a></li> 
       </ul> 
      </div> 
     </section> 

回答

10

在您的身體標記的末尾加載lightbox JavaScript文件。爲我工作。顯然燈箱需要DOM準備解析圖像/鏈接。

+2

是的,但應該是在圖書館,它沒有記錄。我猜想正確的電話會在Github上提出一個問題。 – Phrozen

0

你可以在頁面加載的init收藏:

$(document).ready(function(){ 
    lightbox.init(); 
});