Question

我创建了一个图像库，并希望为图像创建一个jQuery灯箱。在尝试学习语言并创建自己的语言之后，我决定使用来自...... http://lokeshdhakar.com/projects/lightbox2/

的语言。

我现在遇到的问题是当我将它包含在我的图库中时，它会复制图像。我的意思是，当点击图库中的图像时，灯箱弹出图像，但它也有一个图像侧面的“下一个”箭头，当它被点击时，它会带你到一个副本相同的形象。它还包括在图像上包含标题的选项，并且两个（相同图像）中只有一个具有标题。有谁知道如何解决这个问题？我只想要一张图片。

我添加了一行代码，我将灯箱信息添加到（data-lightbox =“image-1”title =“我的标题”）。我在第一张优化图片后立即添加了它。

<li class="gallery_item"><a class="no_decor" href="../images/galleryimages/Optimized-SAM_4910.JPG"><p><img class="border" src="../images/galleryimages/Optimized-SAM_4910.JPG" width="200px" height="200px">Name</a><br/>price</p></li>

由于

Answer 1

移动

<p>

之外的

标签

<a>

标签，您可以解决您的问题。这种事情可能是一个奇怪的问题。

<li class="gallery_item"><p><a class="no_decor" href="../images/galleryimages/Optimized-SAM_4910.JPG"><img class="border" src="../images/galleryimages/Optimized-SAM_4910.JPG" width="200px" height="200px">Name</a><br/>price</p></li>

Answer 2

您在代码中缺少data-lightbox属性并删除了<p>标记。 <p>标签是非法添加的。

<li class="gallery_item"><a data-lightbox="example-1" class="no_decor" href="../images/galleryimages/Optimized-SAM_4910.JPG"><p><img class="border" src="../images/galleryimages/Optimized-SAM_4910.JPG" width="200px" height="200px"></p>Name</a><br/>price</li>

Answer 3

我遇到了一系列Lightbox图像的类似问题。我正在展示＆＃39;图像5的6＆＃39;当系列中只有5个图像时，当您查看第六个图像时，它只是第五个图像的副本。这是因为我的代码没有第5张图片超链接的结束</a>标记。谢谢！

Answer 4

我的图像库问题与4/30而不是1/15相同，并且它复制了图像。我为无限循环更改了lightbox.js参数，似乎解决了这个问题。

$（＆＃39; .yourclass＆＃39）。光滑（{ 点：假，无限：虚假，速度：300， slidesToShow：3， slidesToScroll：3，响应：[]

jQuery Lightbox - 图像复制

4 个答案: