
本文介绍如何使用FancyBox预览单个图片和多个图片, FancyBox 是一款基于 jquery 开发的类 Lightbox 插件。支持图像、视频、地图、内联内容、iframe 和任何其他 HTML 内容。
优点
可以显示图像、HTML 元素、SWF 电影、Iframe 以及 Ajax 请求
可通过设置和 CSS 进行自定义
对相关项目进行分组并添加导航。
如果页面中包含鼠标滚轮插件,那么 FancyBox 也会响应鼠标滚轮事件
使用缓动插件支持花哨的过渡
在缩放项目下添加漂亮的阴影
如何使用:
引用jQuery.js 和 fancybox.js
<script src="js/jquery-1.10.2.min.js" type="text/javascript"></script> <script src="js/jquery.fancybox.js" type="text/javascript"></script>
调用 fancybox.js
<script type="text/javascript"> $(document).ready(function () { $('.fancybox').fancybox(); }); </script>