2009年05月05日｜ Internet < blog

ightboxのjsファイルの日本語化カスタマイズ2

以前lightboxのjsファイルの日本語化カスタマイズについて記事を書いた。そのときの補足で、各種フォルダーの位置を変更したときの対処法を備忘録も兼ねて書いておく。

nextlabel.gif

closelabel.gif

まず一番参考になるのはマイコミのページ。そこに書いてあるとおり、各種ファイルをフォルダ毎アップロードする。フォルダー構成は下記の通りとして、temp.htmlにlightboxを設置するとする。
＋－CSS
＋－js
＋－images
＋－－temp－temp.html
マイコミのページの通りで設置しても正常に動作しない。どうすれば動作するか変更点を記述する。
参考になるページはLightBoxの使い方とカスタマイズのページ。
まず１番目。
1.＜link rel="stylesheet" href="css/lightbox.css" type="text/css" media="screen" /＞
2.＜script src="js/prototype.js" type="text/javascript"＞＜/script＞
3.＜script src="js/scriptaculous.js?load=effects,builder" type="text/javascript"＞＜/script＞
4.＜script src="js/lightbox.js" type="text/javascript"＞＜/script＞
この４行、それぞれcssとjsのフォルダーのリンク先を一つ上のフォルダーに変更する必要がある。つまり「../」を付ければよい。
1.＜link rel="stylesheet" href="../css/lightbox.css" type="text/css" media="screen" /＞
2.＜script src="../js/prototype.js" type="text/javascript"＞＜/script＞
3.＜script src="../js/scriptaculous.js?load=effects,builder" type="text/javascript"＞＜/script＞
4.＜script src="../js/lightbox.js" type="text/javascript"＞＜/script＞
とこのように変える。
画像(63x32)

prevlabel.gif

次にlightbox.cssの中にある16行目、17行目にある
url(../images/prevlabel.gif)
の所、必要に応じて書き換える。今回の場合は、これでよい。ここで、prevlabel.gifは「PREV」の画像。これを置き換えると画像が変わる。