fancyBox:
什么是fancyBox?
fancyBox是一个用来显示图像,html内容和多媒体的工具,其特征是这些元素漂浮在页面之上。
fancyBox构建在jQuery框架之上。
怎么使用?
1.首先,确保你使用的是有效的DOCTYPE.否则FancyBox将不能正常工作.
2.包含必需的JavaScript文件
(推荐从CDN(Content Delivery Network)加载jQuery)
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript" src="/fancybox/jquery.fancybox-1.3.4.pack.js"></script>
jQuery库下载:http://code.jquery.com/jquery-1.8.3.min.js
fancyBox库下载:https://github.com/fancyapps/fancyBox/zipball/v2.1.3
3.添加图片超链接:
<a id="single_1" href="" title="">
<img src="" alt="" />
</a>
超链接的href属性和图片的src属性一样,都是需要显示图片的路径。fancyBox需要id属性来指定位置。
4.调用fancyBox库函数
$(document).ready(function() {
$(".single_1").fancybox();
});
5.看下效果:
推荐学习网站:http://fancyapps.com/fancybox/ http://fancybox.net/home