ホーム > 今更lightbox、lightwindow2.0を使ってみました。
  • カテゴリ:1.webデザイン制作メモ

今更lightbox、lightwindow2.0を使ってみました。

ちょっと必要に迫られて、今さらながらlightboxを使ってみました。

こういうやつです。(このサイトの画像をクリックしてみてください)

いいですね、これ。すごく簡単に挿入できます。
なんかこういう動きが入るだけでちょっと嬉しくなってしまいます…。

↓ダウンロード

  • lightbox2
http://www.lokeshdhakar.com/projects/lightbox2/#download


私のようなajax javascript初心者の方の場合、下記のマイコミジャーナルのページを見れば誰でも設置できると思います。

(ちなみにこのマイコミジャーナルの中のハウツーコンテンツ「ゼロからはじめる」シリーズは、文章が非常にわかりやすいです。このサイトを見ながら手を動かせば、確実に得たい結果が実現できるのでいいですよ。)

  • ゼロからはじめるLightbox 2.0 - 簡単にWebで写真アルバム機能を
http://journal.mycom.co.jp/articles/2007/06/14/lightbox/index.html


高機能ライブラリLightWindow 2.0

あと知らなかったのですが、このlightboxと同じようなものにLightWindow 2.0というものがあるのですがこちらも試してみました(が各設定の変更方法は未確認…)。


↓サンプル及びダウンロード
(緑の四角内テキストをクリックすれば、デモを見る事ができます)

  • LightWindow v2.0
http://www.stickmanlabs.com/lightwindow/

LightWindow 2.0では、lightboxのような画像を表示できるほか

  • htmlを表示できる
  • flashやQuicktimeムービーを表示できる
  • PDFを表示できる
  • 同一サイトの画像だけでなく、別サイトにある画像やhtmlを表示できる
  • lightboxと同じようにグループ化して上記のものを表示できる

ためのjavascriptが格納されています。


また表示サイズや表示位置、close・Next・Prevなど各部分の画像ももちろん変更可能ですし、ユーザーがクリックしなくても時間経過によって動きをつけることができます。

具体的には

  • ユーザーのクリックなしに写真を順にみせていく
  • ページが読み込まれたら画像を自動で表示
  • 一定時間が経過したら自動で画像をとじる

などが可能です。(私にはまだ設定をよく理解できていませんが。。)


こちらも探したらマイコミジャーナルに記事ありました。

  • ゼロからはじめるLightWindow 2.0
http://journal.mycom.co.jp/articles/2007/10/02/lw/index.html


lightboxなどjacascriptを使用する事を嫌うユーザーも多いと聞きますが、私はこのライブラリ非常に使えると思います。

クランアントワークでの使用はなんだか躊躇してしまいますが(エラーが起きた時に自分で対処できそうにない…泣)LightWindowサイトをざっと見た感じでは、商用利用の禁止はしていないようです。
※商用サイトで利用する場合はご自身で確認をお願いします。


ちなみにAccordion v2.0もいい感じ。

こちらはアコーディオン。
同一htmlの一部をクリックで表示/非表示にできるアレです。

最近のjavascript、結局何も試したことがない!という方はぜひお試しあれ〜。

  • Accordion v2.0
http://www.stickmanlabs.com/accordion/

【追記】ajaxとjavascriptを混同していたため記事訂正しました。

またしても自分の無知を晒してしまい、お恥ずかしい限りです。トホホ…。

  • このエントリーをTechnorati に追加
  • このエントリーをはてなブックマークする
  • このエントリーをGoogleBookmark に追加
  • このエントリをLivedoor クリップに追加
  • このblogをはてなアンテナに追加
  • 関連エントリー
  • トラックバック

このエントリーのトラックバックURL: