JavaScript 图片浏览插件:FancyBox

此文章发布于 57 个月前,部分信息可能已经过时,请自行斟酌确认。

之前微酷网介绍过另一个JS图片浏览插件[PhotoSwipe][1],个人觉得集成过程及代码稍显啰嗦,今天又发现一个不错的图片浏览插件FancyBox,集成相当简单效果也不差。

FancyBox 官方网址:http://fancyapps.com/fancybox/3/
Github 地址:https://github.com/fancyapps/fancybox

20190713112605977.png

集成过程相当简单

<!-- 1. Add latest jQuery and fancybox files -->
<script src="//code.jquery.com/jquery-3.3.1.min.js"></script>

<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.css" />
<script src="https://cdn.jsdelivr.net/gh/fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.js"></script>

<!-- 2. Create links -->
<a data-fancybox="gallery" href="big_1.jpg"><img src="small_1.jpg"></a>
<a data-fancybox="gallery" href="big_2.jpg"><img src="small_2.jpg"></a>

<!-- 3. Have fun! -->
最后修改:2019 年 07 月 13 日 11 : 27 AM
如果觉得我的文章对你有用,请随意赞赏

1 条评论

  1. 12312

    根本不是给的这种效果...

发表评论