写真にオンマウスすると、解説などを上下から半透明オーバーレイでブラインドシャッター型のテキストで表示します。スクリプトで開閉スピードを変更できます。また、画像サイズ、オーバーレイのサイズ、オーバーレイの色、オーバーレイのopacity、文字サイズ、文字色、オーバーレイの色などほとんどをCSSから変更できます。
htmlの構造は、「class="heading"」の中のspan要素にタイトル文、画像、「class="caption"」の中のspan要素に解説文という順で配置したものを「class="photo"」で包みます(次のソース参照)。
<div class="photo">
<div class="heading"><span>チューリップ(解説タイトル1)</span></div>
<img src="images/500x200-4.jpg" width="500" height="200" alt="" />
<div class="caption"><span>【解説文1】ダミーテキスト・ダミーテキスト・
ダミーテキスト・ダミーテキスト・ダミーテキスト・ダミーテキスト・ダミーテキスト
</span></div>
</div>