lightboxを使ってみよう！クリックで拡大表示！
lightbox→firefoxでないとうまく表示されない?]〜lightboxJSとは〜
Download:右クリックで「リンク先を保存」以下５ファイルをダウンロード
How to Use: <a href="images/image-1.jpg" rel="lightbox" title="my caption">image
1. Include lightbox.js in your header.
2. Add rel="lightbox" attribute to any link tag to activate the lightbox. For example:
PhotoshopのWebフォトギャラリーで写真を準備
ファイル 自動処理 Webフォトギャラリー → オプション：サムネイル→ thumbnailsフォルダに小さいサイズの画像が書き出される（いちいち１つずつ解像度変更しなくてもいいのですね！便利！）
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "">http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="">http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>lightboxを使ってみよう！</title>
<script type="text/javascript" src="lightbox.js"></script>
<link href="lightbox.css" rel="stylesheet" type="text/css" />
</head>
<body>
<p><a href="20080420/DW001.jpg" rel="lightbox" title="my caption"><img src="20080420/sDW001.jpg" />クリックで拡大表示1</a></p>
<p><a href="20080420/DW002.jpg" rel="lightbox" title="my caption"><img src="20080420/sDW002.jpg" />クリックで拡大表示2</a></p>
<p><a href="20080420/DW003.jpg" rel="lightbox" title="my caption"><img src="20080420/sDW003.jpg" />クリックで拡大表示3</a></p>
<p><a href="20080420/DW004.jpg" rel="lightbox" title="my caption"><img src="20080420/sDW004.jpg" />クリックで拡大表示4</a></p>
<p><a href="20080420/DW005.jpg" rel="lightbox" title="my caption"><img src="20080420/sDW005.jpg" />クリックで拡大表示5</a></p>
</body>
</html>
