photoswipe - 单击外部元素时显示第一张幻灯片

Question

鉴于 codepen 上的标准 Photoswipe 演示：

https://codepen.io/dimsemenov/pen/ZYbPJM

我想知道如何添加元素，例如在同一页面上 html 的一段中说一段文字 link，单击该文字将打开其中一个画廊的第一张图片。

像这样的东西（当然行不通）

<a href="" onClick="opengallery(0)">see gallery</a>

我在页面加载时从 dom 初始化 photoswipe，就像 codepen 示例一样，我在这里看到其他问题也要求类似的功能，但这些问题的答案也在初始化 photoswipe onclick，所以我不想那样做。我需要以某种方式触发已经打开的实例。

Answer 1

比我想象的容易多了。只需要 select 显示第一张幻灯片的 link，并模拟点击它。假设您已经像默认示例一样通过 dom onload 初始化了 photoswipe。

因此，如果我想在页面上显示画廊 3，它被包裹在一个 div 中并且 ID 为 galId3，我可以这样做：

<p>This is a nice product. View <span onclick="initGallery(3)">the gallery</span></p>.

然后js...

function initGallery(gal) {
    $('#galId'+gal+' a:first').click();
}