どれ使おう?モーダルウィンドウ(Lightbox 風スクリプト)を集めてみました

どれ使おう?モーダルウィンドウ(Lightbox 風スクリプト)を集めてみました

この間の春の嵐はすごかったですね。いろいろ飛ばされないように必死だった kimoto です。帰りの電車は久々に足が浮くほどの超満員を経験しました。

さて、ちょっとモーダルウインドウを調べる機会があったのでまとめてみます。
基本的に、全て jQuery で動くものになっています。
最新の情報ってわけではないですが、場面ごとに選べるものを集めてみたのでお試しくださいませ。

超シンプルな軽量スクリプト leanModal

120406_kimoto_01.png

leanModal はとにかく軽量です。デモを触ってみると、その軽さがわかると思います。
ただし、軽さを徹底的に追求した結果なのか、IE6 には対応していないとのこと。
また、イメージギャラリーなどとしては使えないとのことです。
ちょっとした文章を表示するだけの場合などはこれで十分ですね。

そこそこ軽量、そこそこ機能的 Simple Modal

120406_kimoto_02.png

こちらも軽くシンプルな Simple Modal ですが、機能はひと通り揃っているので使える場面は leanModal よりも多いです。
また、このスクリプトの特徴として、ヘッダを掴んで移動させることができます。

5種類から雰囲気を選べる ColorBox

120406_kimoto_03.png

120406_kimoto_04.png

こちらはサイトの雰囲気に合わせてベースの雰囲気を変えることができます。
ボタンの感じやカラーなどが変更できるのが特徴です。
前にサイトを見たときは 4 つだったのですが、今見ると 5 つになってますね。これからも増えるんでしょうか。

ナビゲーションをボタンやサムネイルにもできる fancyBox

120406_kimoto_05.png

動きの良さなどで人気のあった、fancyBox がバージョンアップしていました。
今までの機能以外に、ボタンによるナビゲーションをつけることができたり、それとは別にサムネイルでのナビゲーションも可能です。
でもページ下の方の「Extended functionality」の辺りを試してみてください。
マウスホイールの動きにも対応していりもします。

※追記:こちら、商用利用有料となっていました。利用される場合はご注意ください。

ライブラリを選べる、楽しい動きの Sexy LightBox

120406_kimoto_06.png

こちらも動きの楽しさが特徴 Sexy LightBox ですが、このスクリプトの特徴はライブラリを選べること。
今現在、js ライブラリといえば jQuery が有名ですが、この Sexy LightBox は jQuery 以外に mootools でも使用可能です。
選択の柔軟性だけでなく、動きも面白いので一見の価値アリです。

  • このエントリーをはてなブックマークに追加

この記事を読んだ人にオススメ