Web2.0風の画像をJavaScriptで再現 （Reflection.js）

Web2.0風の反射（Reflection）効果を画像１枚１枚加工していくのは手間がかかる。　そんな面倒くさがりはJavaScriptで再現してしまうのがおすすめ。

Reflection.js を使って、画像の反射効果を簡単に実現することができる。

imgタグにclass="reflect"を追加すれば、指定した画像に反射効果を適用してくれる優れもの、しかも、反射効果に適用する画像の高さ（rheight）、不透明度（ropacity）も指定可能になっている。

実際の記述は以下のようにする。class="reflect rheight50 ropacity50"

動作するブラウザ環境はInternet Explorer 5.5以降、Mozilla Firefox 1.5以降、Opera 9以降、Safari となっている。　ダウンロードファイルにはサンプルのページとReflection.jsが含まれていますので、実際に試してみてください。