燈箱無法正常運作

Question

我目前正在嘗試在我的網站上實施燈箱廣告，但是我無法使其正常工作，我認為沒有任何沖突，並且我已將所有文件放置在正確的位置並鏈接了它們如何顯示您可以訪問lightbox 2網站。 （ http://lokeshdhakar.com/projects/lightbox2/ ）

只是仔細檢查一下：

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

在頭部標簽中

<script src="js/lightbox.js"></script>

位於頁面底部，緊接在body標記之前。

lightbox.css在css目錄中lightbox.js在js目錄中

<li><img src="images/1.png" data-lightbox="image-1" /></li>

以上是我所有圖像標簽的外觀。

我不確定為什么它不起作用。 我已將文件上傳到服務器，並且在該服務器上也無法正常工作。

提前致謝

Answer 1

問題是，您使用的是img標簽，他們明確地說，使用錨a一個。

對我來說，它就像一種魅力：

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/lightbox2/2.8.1/js/lightbox.min.js"></script> <link href="https://cdnjs.cloudflare.com/ajax/libs/lightbox2/2.8.1/css/lightbox.min.css" rel="stylesheet" /> <ul> <li> <a href="https://s-media-cache-ak0.pinimg.com/236x/d7/24/f9/d724f9e2e1a300dbdcb11b1d0491c884.jpg" data-lightbox="panda">Cute baby panda</a> </li> <li> <a href="https://s-media-cache-ak0.pinimg.com/236x/25/17/52/2517525a674d91b127938e55a72f0f12.jpg" data-lightbox="panda">Another</a> </li> <li> <a href="http://i.ytimg.com/vi/qfsRZsvraD8/hqdefault.jpg" data-lightbox="panda">Last one</a> </li> </ul> 

Answer 2

該文檔說使用<a> （錨標記）來觸發燈箱。

<li>
  <a href="images/1.png" data-lightbox="image-1">
    <img src="images/1.png" />
  </a>
</li>