Fancybox 3拇指来源

Question

如果我以这种格式打开图像组，fancybox 将使用 img 作为缩略图，使用 href 作为大图像源。

<a href="https://c1.staticflickr.com/9/8148/29324593462_abebaddc38_k.jpg" data-fancybox="images">
      <img src="https://c1.staticflickr.com/9/8148/29324593462_f890687b7a_m.jpg" />
</a>

<a href="https://c2.staticflickr.com/6/5499/30972532232_051e1dc57e_h.jpg" data-fancybox="images">
      <img src="https://c2.staticflickr.com/6/5499/30972532232_e9a298a0c5_m.jpg" />
</a>

示例：https://codepen.io/fancyapps/pen/WjVXyx?editors=1000

但是，如果我使用 api 打开 fancybox，例如 os:

$.fancybox.open([
{
    src  : '1_b.jpg',
    opts : {
        caption : 'First caption'
    }
},
{
    src  : '2_b.jpg',
    opts : {
        caption : 'Second caption'
    }
    }
]);

Fancybox 将为缩略图和大图使用 src。

示例：https://codepen.io/fancyapps/pen/GEKgjp?editors=1010

在这种情况下有没有办法指定拇指来源？

Answer 1

使用 thumb 选项简单地传递源：

opts : {
    caption : 'First caption',
    thumb   : 'https://c1.staticflickr.com/9/8148/29324593462_f890687b7a_m.jpg'
}

演示 - https://codepen.io/anon/pen/jGboRW?editors=1010

Fancybox 3拇指来源

Fancybox 3 thumb source

html

javascript

fancybox