Lightbox JS の Movable Type での不具合を修正する
Category：[Lightbox JS]
Tag：[Customize, JavaScript, Lightbox, MovableType]
Permalink
昨日エントリーしたLightbox JS で画像を表示するですが、Movable Type のアーカイブページ（カテゴリー・アーカイブ／月別アーカイブ／エントリー・アーカイブ）で正常に動作しないようでした。すいません。
下記に対処方法を記しておきます。
１．lightbox.css / lightbox.js の修正
カテゴリー・アーカイブ／月別アーカイブ（日別・週別も同じ）／エントリー・アーカイブの各ページのパスが loading.gif のパスと異なるため、lightbox.js の193行目で下記の JavaScript エラーが発生し、正常に読み込めないようです。
objLoadingImage has no propertiesとりあえず loading.gif のパスにドメインを追加することでOKになりました。具体的には、当サイトの場合であれば、lightbox.js の36行目辺り
var loadingImage = 'loading.gif';
var closeButton = 'close.gif';を
var loadingImage = 'http://www.koikikukan.com/loading.gif';
var closeButton = 'http://www.koikikukan.com/close.gif';に変更します。なお試験サイトではドキュメントルートからのパス設定でも大丈夫でした。
またIEでは overlay.png のパスもきちんと設定しないと正常に読み込めないため、lightbox.css の14行目と20行目にある overlay.png にドメインを追加します。当サイトの例は下記の通りです。
#overlay{ background-image: url(http://www.koikikukan.com/overlay.png); }
* html #overlay{
background-color: #333;
back\ground-color: transparent;
background-image: url(blank.gif);
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src="http://www.koikikukan.com/overlay.png", sizingMethod="scale");
}lightbox.css の内容を styles-site.css に転記している場合（かつ普通に再構築対象にしている場合）や、ligjtbox.css をインデックステンプレートとして登録している場合は、<$MTBlogURL$>overlay.png とすればOKです。こちらも試験サイトではドキュメントルートからの設定で正常に読み込めました。
２．エントリー・アーカイブの修正
エントリー・アーカイブは１項の他に、onloadイベントハンドラとの競合で正常に動作しないという報告を下記のサイトで頂いています。ありがとうございました。
対処は、安直ですがエントリーアーカイブの onload イベントハンドラ（赤色部分）
<body class="…" onload="individualArchivesOnLoad(commenter_name);>を一旦削除して、
<body class="…">とし、エントリー・アーカイブの一番最後に
<script type="text/javascript">
<!--
individualArchivesOnLoad(commenter_name);
//-->
</script>を追加しています。この individualArchivesOnLoad は、サイン・イン中であれば名前とメール欄を非表示にし、各フォームにCookie情報を埋め込む動作を行っているだけですので、この対処で問題ない筈です。
ちなみに onload イベントハンドラに2行書いたりしてみましたがNGでした。
３．ローディング画像・背景画像が表示されない場合
１項で修正した loading.gif のURL、および overlay.png のURLをブラウザのアドレス欄に直接入力してください。画像が表示されない場合、設定したURLが誤っていますので、１項で設定したURLを修正してください。
2006.03.21 追記
１項の close.gif の設定、および３項を追記しました。
