Question

我对Fancybox 3有疑问。我的网页上有很多（10-15）个图片库，每个图片库大约有50张图片。每个图库在主页上都有一个图片链接。 fancybox使用的更好/更有效？：

无缩略图使用 - ＆gt;缩略图网格是从大尺寸图像生成的 - ＆gt;效果：当打开一个图库时，所有大图片都会被加载。

<p>
    <a href="big.jpg" data-fancybox="images">      
    <img src="small_thumbnail.jpg" />
    </a>
</p>

<div style="display: none;">
    <a href="big_1.jpg" data-fancybox="images"></a>
    <a href="big_2.jpg" data-fancybox="images"></a>
</div>

使用缩略图 - ＆gt;从缩略图小尺寸图像生成缩略图网格 - ＆gt;效果：当打开主页面时，所有缩略图都被加载而没有任何图库打开。

<p>
    <a href="big.jpg" data-fancybox="images">
    <img src="small_thumbnail.jpg" />
    </a>
</p>

<div style="display: none;">
    <a href="big_1.jpg" data-fancybox="images"> <img src="small_1_thumbnail.jpg"> </a>
    <a href="big_2.jpg" data-fancybox="images"> <img src="small_2_thumbnail.jpg"></a>
</div>

Answer 1

您还有其他选项 - 使用data-thumb属性存储自定义缩略图图像。例如：

  <a href="big-image.jpg" data-fancybox="images"
     data-thumb="small-image.jpg"></a>

请参阅此演示 - http://codepen.io/fancyapps/pen/yMxzvE?editors=1010

使用带有或不带缩略图的Fancybox 3图像库？

1 个答案: