加载 SwipeBox 画廊并打开外部链接答案

【问题标题】：Load SwipeBox gallery and open external link加载 SwipeBox 画廊并打开外部链接
【发布时间】：2021-07-03 12:46:52
【问题描述】：

<li>
    <a rel="gallery-3" href="images/photos/photo7.jpg" title="Photo title" class="swipebox">
       <img src="images/photos/photo7.jpg" alt="image"/>
    </a>
</li>

如何在 swipebox 中插入和打开外部链接（单击图像时重定向到另一个 url），我已经尝试了一整天并且谷歌搜索，但我无法单击 swipebox 中的 img。

这是网址：http://azparts.epizy.com/blix/#!/photos.html

【问题讨论】：

标签： jquery css hyperlink

【解决方案1】：

您发布的代码 sn-p 完全符合您的要求。它会打开在锚标记的 href 中定义的新 url - 在您的情况下是图像 url。

工作示例：

<a rel="gallery-3" href="https://cdn.sstatic.net/Sites/stackoverflow/Img/favicon.ico?v=ec617d715196" title="Photo title" class="swipebox">
  <img src="https://cdn.sstatic.net/Sites/stackoverflow/Img/favicon.ico?v=ec617d715196" alt="image" />
</a>

除了图像 url，您还可以定义任何其他 url，例如 stackoverflow。

工作示例：

<a rel="gallery-3" href="https://stackoverflow.com/help/how-to-ask" title="Photo title" class="swipebox">
  <img src="https://cdn.sstatic.net/Sites/stackoverflow/Img/favicon.ico?v=ec617d715196" alt="image"/>
</a>

在您的特殊 swipebox 情况下，如果锚标记中有“swipebox”类，则链接有效。然后图像将在灯箱中打开。但这仅在链接的 href 指向图像 url 时才有效。它也适用于我的 stackoverflow 示例 sn-p，但图像未加载，因为它来自另一台服务器 - 错误：“跨源读取阻止”（请参阅浏览器开发人员工具中的控制台）。 photo2.png 周围的锚点没有 class="swipebox" ，因此在 swipebox 中不起作用...

【讨论】：

我试过这个，但是不行，你可以查看我的demo [demo][1] [1]：azparts.epizy.com/blix/index.html#!/photos.html
我在检查您的页面后更新了我的答案，并将您的页面链接添加到您的问题...
最后，在swipebox中点击img无法打开外部链接？那么，如果我不想在灯箱中打开 img，只需单击 img 并重定向到外部链接，我该如何编码？
是的，我想是的。但也许你在 documentation 或 swipbox-github-page Open external images via swipebox? 的问题博客中找到了解决方案（这是“swipebox external link”的第二个谷歌结果）......
非常感谢@biberman，祝你有美好的一天。