试验一下light box 2

很早就发现不少网站显示图像的时候很特别，比如说wordpress.org上面显示博客模版的那个浏览器，以及blogger的一个模版站的图像显示功能。但是我一直不知道这个叫做light box，是一个javascript的图像显示代码。官方网站在这里：http://www.huddletogether.com/projects/lightbox2/
安装的过程是这样的：
首先到官方网站下载代码。
之后是修改文件中图像的路径。
然后上传到你认为比较稳定的空间去。我用的googlepages。
在博客模版中的head标记中添加下面的代码：

<script type="text/javascript" src="js/prototype.js"></script>
<script type="text/javascript" src="js/scriptaculous.js?load=effects"></script>
<script type="text/javascript" src="js/lightbox.js"></script>
<link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" />

在调用light box的地方使用这样的代码，增加一个rel="lightbox"的属性：

<a href="images/image-1.jpg" rel="lightbox" title="my caption">image #1</a>

如果是一组图片可以添加这样的代码，其中中括号内是组的名称：

<a href="images/image-1.jpg" rel="lightbox[roadtrip]">image #1</a>
<a href="images/image-2.jpg" rel="lightbox[roadtrip]">image #2</a>
<a href="images/image-3.jpg" rel="lightbox[roadtrip]">image #3</a>

点击这些图片可以查看到效果。