如何通过单击单个图像或按钮来启动fancybox 3幻灯片放映

如何通过单击单个图像或按钮来启动fancybox 3幻灯片放映。 Fancyapps网站上有一个很好的示例，其中包含自定义演示，但没有针对此案例的编码示例。

Answer 1

如果您正在寻找一种方法来启动带有一个预览图像的图库，那么只需创建您的链接并仅显示第一个链接，请参阅此演示 – https://codepen.io/fancyapps/pen/WjVXyx?editors=1000

Answer 2

这是如何通过单击图像打开fancyBox库的示例：

您只需要将图像封装在ancors中并为这些锚点提供相同的data-fancybox属性值，在上面的示例中它是“my_gallery”。

这样，您的每个图像都将变为可点击，并将打开包含来自同一图库的所有图像的fancyBox图库（data-fancybox属性值）

要通过单击按钮打开fancyBox，您需要添加按钮

 Open gallery 

在您的JS代码中，将单击事件处理程序添加到将打开您的库的该按钮

 $(document).ready(function() { $('button.open-gallery').click(function() { $('a[data-fancybox="my_gallery"]').first().trigger('click'); }); });