您现在的位置是:首页 > 技术交流技术交流
jquery.fancybox网页弹窗插件
2023-02-27【技术交流】3839 人已围观
简介jquery.fancybox 是一个好用方便的网页弹窗插件。fancyBox3 中文文档译文永久地址:https://kangkai124.git...
jquery.fancybox 是一个好用方便的网页弹窗插件。
fancyBox3 中文文档
1. 介绍
1.1 依赖
1.2 兼容
2. 配置
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>My page</title> <!-- CSS --> <link rel="stylesheet" type="text/css" href="jquery.fancybox.min.css"> </head> <body> <!-- Your HTML content goes here --> <!-- JS --> <script src="//code.jquery.com/jquery-3.2.1.min.js"></script> <script src="jquery.fancybox.min.js"></script> </body> </html>
2.1 下载fancyBox
插件还提供了一些在线安装的方法,小编还没有用过就不介绍了。
3. 使用
3.1 使用data属性初始化
<a href="image.jpg" data-fancybox data-caption="My caption"> <img src="thumbnail.jpg" alt="" /> </a>
3.2 使用JavaScript初始化
<script type="text/javascript"> $("[data-fancybox]").fancybox({ // Options will go here }); </script>
$().fancybox({ selector : '[data-fancybox="images"]', loop : true });
如果你有一组元素,组内元素使用相同的data-fancybox
值就可以组成一个相册。不同的组应该使用不同的属性值加以区分。
fancybox支持的媒体类型:imgeas,video,ajax ,iframe 一般都会自动判断。 也可以手工指定。 一般的用户以上信息即可应用。
关注宁波网站建设博客,更多精彩分享,敬请期待!
Tags:fancybox
很赞哦! ()
相关文章
随机图文
dedecms5.7生成文件时提示“模板文件不存在,无法解析”的解决方法
dedecms是一个非常经典的cms系统,并且开源很多做网站的人都喜欢用他,那么在网站生成文件的时候,出现错误提示“模板文件不存在,无法解析...Dreamweaver中设置代码视图时的代码字体大小(默认字体)
在Dreamweaver代码视图下,选择“编辑”菜单 ——> 首选参数——> 左边的分类选“新建文档” ——> 右边字体...Jquery判断元素是否存在?
我们在传统的Js里,对某个页面元素进行某种操作前,最好先判断这个元素是否存在。原因是对一个不存在的元素进行操作是不允许的。有的时候,要根据页...Layer弹出层关闭后刷新父页面
layer调用END回调方法: end - 层销毁后触发的回调 类型:Function,默认:null 无论是确认还是取消,只要层被销...