『Lightbox JS』導入メモ
Wednesday, Jun 28, 2006 - 00:57 +09:00
『Lightbox JS』は、大きめの画像なんかを画面遷移なしでかっこよく表示してくれるスクリプト。サンプルは以下。
「サムネール → 原寸大の画像」みたいな感じで使います。
デフォルトでも十分かっこいいけど、中身がシンプルなので、ちょこっと改造するにも簡単です。さらにCCライセンスの帰属 2.5で公開されていて、作者のクレジットを消さなければ商用も改造も二次配布もOK。Sig.も仕事で使わせてもらってます。
導入手順は、以下。
- 公式サイトからファイルを入手
- 自サイトに設置
- リンクを張る
これだけ。簡単でしょ？
補足
- JSファイルへのリンク
<script type="text/javascript" src="lightbox.js"></script>- 画像部分に<a>タグ追加
<a href="images/image-1.jpg" rel="lightbox" title="my caption">image #1</a>
- <a>の中身は自由（テキストだけでも可）
- CSSファイルは外部CSSと統合してもOK
- 画像ファイルへのアクセスは絶対パスで指定する。
（JSファイル内と、CSS中のAlphaImageLoader指定のところ
『Lightbox 2』について
Lightbox JSの大流行を受けて、配信元では先日『Lightbox JS v2.0』が発表されました。こちらは、Flashライクなアニメーション、画像のグループ化によるスライドショーの実装など、いろいろゴージャスになってます。ただ多機能なぶん、ちょ～っと動作が重いようです。
軽快さやシンプルさを重視する人は「Lightbox」を、新しモノ好きや動かしたい人は「Lightbox 2」を使用する、という使い分けがされているみたい。
ちなみにSig.は、シンプルなv1が好きです。
posted in Javascript Trackback (1)
1 Trackbacks
- #310 - Lightboxメモ / July 09, 2006 at 13:17
- ほっとくと忘れそうなのでメモしておこう。 ROSS : 『Lightbox JS... 続きを読む
- from Fivestar
- このエントリーのトラックバックURL
- http://rospear.info/other/mt-tb.cgi/188