Lightbox2

いわゆる Lightbox な機能を提供する jQuery のプラグインです。
以前は、Lightbox, Thickboxがありましたが、それぞれ開発が終了してしまっているので、その代替となるものです。

使い方

公式サイトからアーカイブをダウンロードし、展開します。

 % gzip -dc lightbox2.6.zip |tar xvf -

展開して出来たディレクトリ内の必要なファイルを適宜設置します。

利用したい HTML 内には以下の記述を行います。

必要なファイルを読み込む。

 <script type="text/javascript" src="/js/jquery.js"></script>
 <script type="text/javascript" src="/js/lightbox-2.6.min.js"></script>
 <link rel="stylesheet" href="/css/lightbox.css" type="text/css" media="screen" />

拡大表示させたい箇所は以下のように記述。

 <a href="xxxx.jpg" data-lightbox="lightbox01"><img src="xxxx-thumb.jpg" /></a>

data-lightbox という属性が、Lightbox2 に対応させる指定となります。
設定した値は、同一であれば同一グループとして見なすようです。