東京ウェブデザへろへろ日記
ポップアップウィンドウの進化形、ライトボックス。
写真をポップアップで見せるとき、もうひと味、演出を加える方法がある。それがライトボックスだ。
初心者の方のために説明すると、ホームページ上にサムネイルをのせておいて、その写真をクリックするとサイズを固定した窓が開いて、そこに大きな写真が出てくる、それがポップアップウィンドウである。私自身はあまり好きな構造ではないが、この形式がとても好きな人もいる。
そうしたポップアップの一種で、そこに演出を加えて、ちょってお粋な感じを出すスクリプトが「ライトボックス」である。
ライトボックスというのは、元の意味は、ポジフィルムを見るための照明装置でである。たしかにそういうイメージになっている。光のコントラストを強調しているので、写真をキレイに見せることができる。
今回は、下記のサイトが提供しているフリーのスクリプトを使ってみた。
http://www.lokeshdhakar.com/projects/lightbox2/
ジャバスクリプトを使っているようだ（もしかしたらAjaxかもしれない）。使い方は簡単である。解説は英語なのでその点がわかりにくいが...
まず、ジャバスクリプトのリンクをコピーして貼り、次にCSSのリンクをコピーして貼る。そして、フォルダの中に入っているファイルを自分の制作しているサイトのフォルダに入れて、自分のサイトのサムネイル画像から、リンクを貼る。このリンクの貼り方は英語で例文が書いてある通りにする。（ただし導入ファイルが同階層の場合）。
どうですか、うまく行きましたか。わりと簡単にできて、演出効果が高いと思う。
