fancyBox 介绍
FancyBox提供了一种简洁优雅的方式去为图片、网页和多媒体添加灯箱功能。
特点
1、允许我们用鼠标和键盘上的四个方向键切换图片2、可以根据当前窗口大小自动调整弹出框的大小，当我们改变浏览器窗口大小时，将会看到弹出框自动缩放了3、支持缩略图和按钮帮助导航4、弹出框支持显示多种类型的内容（图片，html，视频……）如何使用
首先下载插件，解压然后复制文件到你的网站/项目文件夹中。在 中加载文件。确保你已经加载了 jQuery：<head><script type="text/JavaScript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"></script><link rel="stylesheet" href="/fancybox/jquery.fancybox.css" type="text/css" media="screen" /><script type="text/JavaScript" src="/fancybox/jquery.fancybox.pack.js"></script></head>创建你自己的链接，加上 fancybox 样式名，如果你想显示一个标题，那就给该链接加上一个 title 属性。<a href="large_image.jpg" title="Sample title"><img src="small_image.jpg" /></a>如果你有一组相关的图片，你得额外加上一个 rel（或 data-fancybox-group） 属性，给其赋一个组名：<a href="large_1.jpg" rel="gallery" title="Sample title 1"><img src="small_1.jpg" /></a><a href="large_2.jpg" rel="gallery" title="Sample title 1"><img src="small_2.jpg" /></a>用如下脚本初始化：<script>$(document).ready(function() {$('.fancybox').fancybox();});</script>你也可以给初始化脚本加上一些可选项来扩展默认的配置，比如：<script>$(document).ready(function() {$('.fancybox').fancybox({padding : 0,openEffect : 'elastic'});});</script>提示: 自动分组然后将 fancyBox 应用到所有图片上：$("a[href$='.jpg'],a[href$='.jpeg'],a[href$='.png'],a[href$='.gif']").attr('rel','gallery').fancybox();脚本用到了匹配的元素的 href 属性来取得内容的位置，以及找出你想要展示的内容类型。你可以通过添加样式名（fancybox.image,fancybox.iframe,等等）或者 data-fancybox-type 属性来直接指定类型：//Ajax:<a href="/example.html">Example</a>//or<a href="/example.html" data-fancybox-type="ajax">Example</a>//Iframe:<a href="example.html">Example</a>//Inline (will display an element with `id="example"`)<a href="#example">Example</a>//SWF:<a href="example.swf">Example</a>//Image:<a href="example.jpg">Example</a>注意，ajax 请求会受到 同源策略 的影响。如果 fancyBox 不能获得内容类型，它将会根据 href 属性值来猜测，如果不成功就会静默退出（这和以前的版本是不一样的，如果猜测不成功就会展示一个错误信息）。链接: http://www.fly63.com/nav/1328网站地址:http://fancyapps.com/fancybox/3/
GitHub:https://github.com/fancyapps/fancybox
网站描述:一款优秀的弹出框Jquery插件
fancyBox
官方网站：http://fancyapps.com/fancybox/3/
小编说
版权声明：本文内容由互联网用户自发贡献，该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容， 请发送邮件至 dio@foxmail.com 举报，一经查实，本站将立刻删除。