javascript - 没有缩略图的 Fancybox 画廊

标签 javascript jquery fancybox

我正在使用 FancyBox,我想在页面上制作一个没有缩略图的画廊。

我有一组图片:

http://blabla/image1.jpg
http://blabla/image2.jpg
http://blabla/image3.jpg

我有一个 span 元素:

<span style="text-decoration: underline">click to view gallery</span>

我不需要页面上的任何缩略图,我只希望它们在用户单击跨度时显示为 FancyBox 画廊。我需要某种 javascript FancyBox 启动代码,我用谷歌搜索了一下,但似乎没有相应的功能 (???)。

最好的方法是什么?谢谢!

最佳答案

将点击事件附加到该跨度

<span id="myspan" style="text-decoration: underline; cursor:pointer;">click to view gallery</span>

<script>
    $("#myspan").click(function() {
    $.fancybox([
            'http://blabla/image1.jpg',
            'http://blabla/image2.jpg',
            'http://blabla/image3.jpg'
        ], {
            'padding'           : 0,
            'transitionIn'      : 'none',
            'transitionOut'     : 'none',
            'type'              : 'image',
            'changeFade'        : 0
        });
    });
</script>

关于javascript - 没有缩略图的 Fancybox 画廊,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7062662/

相关文章:

javascript - 重新加载页面时保持页面设置

html - 为什么我的 Flash 动画覆盖了我的 div 位置?

javascript - 尝试在类似类的 javascript 中使用 Angular ngTable

javascript - 如何在jQuery中选择HTML5数据属性?

javascript - 如何正确使用Promise.all?

javascript - 如何实现我在 php 中使用的 simplepagination 插件?

javascript - Fancybox 的问题。 Iframe 仅适用于网站上的第一个链接

safari 中的 jQuery fancybox z-index 问题

javascript - NodeJS - 使用 mongoose 解析大型集合

javascript - 如何在 Angular 9 中使用 print.js 打印多个 PDF