【作ってみた】Lightboxを作ってみた

いつも拝見している 5509 さんのブログで、「誰が使うの？何の役にも立たないjQueryプラグイン10選」というエントリが公開されています。
独創的な発想に満ちたjQueryプラグインで、たぶん使うことはないけど多いに笑えます。

その中の一つ、「これからの新標準LightBox jDTLightBox.js」というLightboxのプラグインがあります。
こちらもご多分に漏れず大変ユニークなプラグインなのですが、そういえば自分でLightbox的なものを作ったことがないなと思い、これを参考に作ってみることにしました。

デモ
ダウンロード（140KB）

特徴

かなりシンプルなLightboxです。jQuery利用。
画像(jpg,gif,png)とiframeコンテンツに対応してます。
内容のサイズを取得して、表示サイズが自動で調整されます。
表示の際のアニメーションはありません。
（コメントアウトしてあるところをいじるとアニメーションのヒントになるかも？）

使い方

１）シンプルな利用法（画像の場合）
（HTML）

画像を表示

（JavaScript）

$("#hoge").qBox();

２）オプションを指定
（HTML）

画像を表示

（JavaScript）

$("#hoge").qBox({
   href:"http://quoit.jp/",
   width:500,
   height:400
});

実装課題

・iframeコンテンツを表示した際の履歴の管理。
　→iframe内でsubmitイベントが発生したときに制御しきれていない
　→完全に制御する必要に迫られなければ問題はないのだろうか。。

ご注意

このスクリプトが原因で発生した不利益、不具合に関しての責任は一切負いません。
ご利用にあたっては自己責任でお願い致します。

ライセンス

ライセンスはjDTLightboxを継承してMITです。
基本的にどんなに改造してもらっても構いません。
構造がシンプルなので、初めてLightboxを作ってみようという方にはオススメだと思います。

問題点、改善要望は下記コメント欄かTwitterまで。