【问题标题】:Fancybox 3 thumb sourceFancybox 3拇指源
【发布时间】:2017-09-18 07:51:38
【问题描述】:

如果我以这种格式打开一组图像,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

但是,如果我使用 os 之类的 api 打开fancybox:

$.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

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

【问题讨论】:

    标签: javascript html fancybox


    【解决方案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

    【讨论】:

      猜你喜欢
      • 2012-12-20
      • 2012-09-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多