很多细心的朋友都发现阿泽的博客有个小特效，一点图片有个非常炫的动态效果，其实这只是用的一个叫做Shadowbox的JS类库插件来实现的。偶然间发现这个类库也是通过张好运同学用的一个名叫Shadowbox的Wordpress插件，后来我发现此WP插件的Shadowbox版本不是最新的，速度不行，所以就找到了Shadowbox的官方网站，稍微研究了一下，发现还挺好用的，独乐乐不如众乐乐，阿泽现在给大家分享一下。
官方支持站点
http://www.shadowbox-js.com/
大家可以从官方网站下载，不过官方的版本是不带FLV播放器的，所以阿泽也压缩了一个带播放器的版本
http://www.a-ze.com/share/shadowbox_full.rar
使用方法很简单，把解压后的程序目录上传到网站的根目录，然后在页面的<HEAD>部分加入下面的代码
- <link rel="stylesheet" type="text/css" href="/shadowbox/shadowbox.css">
- <script type="text/javascript" src="/shadowbox/shadowbox.js"></script>
- <script type="text/javascript">Shadowbox.init({ language: 'en', players: ['img', 'html', 'iframe', 'qt', 'wmp', 'swf', 'flv']});</script>
- </link>
然后在需要的超链接的<a>标记内插入 rel=”shadowbox”
图片应用范例
- <a rel="shadowbox;width=500;height=590" href="http://www.a-ze.com/wp-content/uploads/2009/12/3.jpg">
- <img title="阿泽与糖葫芦西施的合影" src="http://www.a-ze.com/wp-content/uploads/2009/12/3.jpg" alt="" width="500" height="590" />
- </a>
点击下面的图片测试：我和糖葫芦西施MM的合影
Shadowbox不仅仅支持图片，还支持FLASH，FLV视频，Windows Media Player能播放的视频，QuickTime能播放的视频，Html页面等等…… 使用方法也是一样的。
具体的运用还是亲自试一试吧，很简单的，另外还有一些参数的运用，阿泽暂时也不是搞的太明白，欢迎一起深入研究。
本页面链接地址（或者引用地址 Trackback）
# 2010年01月03日 星期日 09:59
ShadowBox更新了吗？我博客的那个用更新下不？
# 2010年01月03日 星期日 10:16
@ZHY, 没有更新啊，还是五月份的版本！
# 2010年01月03日 星期日 19:19
西施就是西施，好漂亮的MM啊 。
# 2010年01月03日 星期日 20:08
@苏囧, 哈哈，名不虚传吧？
# 2010年01月04日 星期一 10:51
一看到下面图片就不想看代码了。
# 2010年01月04日 星期一 18:54
@猫哥, 哈哈，要镇定！~
# 2010年01月04日 星期一 23:26
不如Lightbox好看
你长相好可爱啊 我第一次见了MM照片没赞美MM的
# 2010年01月05日 星期二 07:58
@飞晏, 哈哈，不会吧，莫非是我影响了市容？
# 2010年07月01日 星期四 17:52
请教阿泽，这个插件能不能外链土豆或者优酷的视频的呢？
如果弹出来的框还能播放土豆的视频，那就完美一点了，我正需要这样的插件。
还望阿泽指教一下啊
# 2010年07月04日 星期日 20:20
@afilu, 是可以的。土豆或者优酷的视频都有FLASH的链接。不好意思，回复晚了。见谅！~
# 2010年08月16日 星期一 16:22
我感动的内牛满面，用官网上的代码放到header.php里根本木反应，多亏了博主
# 2010年08月16日 星期一 21:27
@HeilAsuka, 哈哈，太客气了！~
# 2010年08月20日 星期五 16:28
请问html无效怎么办（就是点链接直接就打开了，没有产生效果）
我没加什么代码 除了html都正常 如果要加 加在哪里 是主题的header吗？还是根目录的那个header？
# 2010年08月21日 星期六 15:44
@乔治, 如果我没有猜错的话你应该是指的在WordPress里面把？首先要在主题模板的header.php中的head部分加入那部分JS，然后在需要的 a 标签中rel标记就可以了。