jQuery Colorbox是一款弹出层，内容播放插件，效果极佳，最关键的是大小只有10KB，当然我主要是用来弹出图片啦，(之前介绍过jquery Fancybox插件，个人很喜欢)。jQuery Colorbox不仅有弹性动画效果，淡入淡出效果，幻灯片播放,宽度自定义，还能够ajax加载html,iframe等等，最主要的是它还可以写回调函数。废话少说，请看5种演示效果：
http://www.phpddt.com/demo/colorbox/example1/
http://www.phpddt.com/demo/colorbox/example2/
http://www.phpddt.com/demo/colorbox/example3/
http://www.phpddt.com/demo/colorbox/example4/
http://www.phpddt.com/demo/colorbox/example5/
使用当然非常简单：
首先引入jquery，colorbox插件，colorbox的css
<script type="text/javascript" src="http://www.phpddt.com/usr/themes/dddefault/jquery-1.4.2.min.js"></script>
<script src="http://www.phpddt.com/demo/colorbox/colorbox/jquery.colorbox.js"></script>
<link media="screen" rel="stylesheet" href="http://www.phpddt.com/demo/colorbox/colorbox/colorbox.css" />
然后看html代码
<p><a class="group1" data-rel='hi' href="../content/ohoopee1.jpg" title="Me and my grandfather on the Ohoopee.">第一组图片演示</a></p>
<p><a class="group1" href="../content/ohoopee2.jpg" title="On the Ohoopee as a child">第一组图片演示</a></p>
<p><a class="group1" href="../content/ohoopee3.jpg" title="On the Ohoopee as an adult">第一组图片演示</a></p>
调用colorbox代码：
<script>
$(document).ready(function(){
$(".group1").colorbox({ rel: 'group1' });
});
</script>
当然更多教程请移步官网：http://www.jacklmoore.com/colorbox/
附上jquery colorbox设置翻译：