首页 > 其他 > 详细

fancybox图片灯箱功能

时间:2020-02-21 21:15:00      阅读:84      评论:0      收藏:0      [点我收藏+]

fancybox图片灯箱功能

在页面中引入几个文件

<script src="https://cdn.jsdelivr.net/npm/jquery@3.4.1/dist/jquery.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>

在博客文件中需要加载图片的地方插入下面html代码

<a data-fancybox="gallery" href="图片链接"><img src="图片链接"></a>
<a data-fancybox="gallery" href="图片链接"><img src="图片链接"></a>

效果:

技术分享图片

fancybox图片灯箱功能

原文:https://www.cnblogs.com/guotianbao/p/12343012.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!