jQuery Lightbox - 图像复制答案

【问题标题】：jQuery Lightbox - image duplicationjQuery Lightbox - 图像复制
【发布时间】：2016-07-22 00:30:01
【问题描述】：

我创建了一个图片库，并想为这些图片创建一个 jQuery 灯箱。在尝试学习该语言并创建自己的语言时遇到一些问题后，我决定使用来自... http://lokeshdhakar.com/projects/lightbox2/

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

我包含了我要添加灯箱信息的代码行之一 (data-lightbox="image-1" title="My caption")。我在第一个优化图像之后添加了它。

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

谢谢

【问题讨论】：

标签： jquery

【解决方案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>

【讨论】：

谢谢。我重新格式化了我的一些其他类，以便我可以删除
标记，它解决了问题。

【解决方案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>

【讨论】：

【解决方案3】：

我在使用一系列 Lightbox 图片时遇到了类似的问题。当系列中只有 5 张图片时，我的显示“图片 5 of 6”，而当您查看第六张图片时，它只是第五张图片的副本。这是因为我的代码没有第五张图片的超链接的结束 </a> 标记。谢谢！

【讨论】：

【解决方案4】：

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

$('.yourclass').slick({ 点：假，无限：假，速度：300，幻灯片显示：3， slidesToScroll: 3, 响应式：[]

【讨论】：