[JS]軽量で、簡単に設置できるLightbox風のスクリプト -iBox
Post on:2008年3月13日
iBoxは、画像・動画・インラインコンテンツ・ドキュメント・フォームなどをLightbox風のエフェクトで表示するスクリプトです。
iBox - Lightweight inline popup
Lightbox風のスクリプトは多数ありますが、その多くはjQueryやPrototypeなどのライブラリと一緒に設置しないと動作しなかったりしますが、このiBoxは単独で実装することができます。
また、容量も18.5KBと他の多くのスクリプトと比べ軽く、Packerを使用すると7KBになります。
iBoxの実装方法は、「ibox.js」と「ibox.css」を外部ファイルとして指定し、下記のコードを記述します。
titleは、キャプションとして表示されます。
画像
1 2 3 |
<textarea name="code" class="html" cols="60" rows="5"> <a href="images/large/image_1b.jpg" rel="ibox" title="Good Barbeque at 1024x450!"><img src="images/small/image_1.jpg" alt=""/></a> </textarea> |
ドキュメントファイル
1 2 3 |
<textarea name="code" class="html" cols="60" rows="5"> <a href="ibox-ajax-test.html" rel="ibox" title="Loading External HTML File using AJAX" >ibox-ajax-test.html</a> </textarea> |
YouTube
1 2 3 |
<textarea name="code" class="html" cols="60" rows="5"> <a href="http://www.youtube.com/watch?v=Sr2JneittqQ" rel="ibox" >My YouTube Video</a> </textarea> |
sponsors