Lightbox JSとscript.aculo.usを組み合わせてみた。
左のサムネイルをクリックしてみてください。大きな画像がふわーっとフェードインで表示されます（IEのバージョンによっては動かないぽい）。

やり方はとても簡単。

scriptaculous.jsを読み込んだ上で、lightbox.jsのshowLightbox()とhideLightbox()の中にそれぞれ、

195行目付近に
objLightbox.style.display = ‘none’;
new Effect.Appear(objLightbox, {duration:0.6});
てのと
224行目付近に
objOverlay.style.display = ‘none’;
new Effect.Fade(objLightbox, {duration:0.6, afterFinish: function() {objLightbox.style.display = ‘none’;}});

てな感じのを適当に入れるだけ。速度を変えたいときはduration:をいじって。数値をあげれば遅くなる。
Appear/Fade以外の関数を使ってもいろいろと遊べそう。
一応ここにJSファイル置いときますね´・ω・`)
（画像パスなどはご自分のに置き換えてください）
あーscript.aculo.usたのしー

Tweet