日本語化する

iBoxでは画像やページが表示された際の右下に英語で「Click here to close」と表示されます。英語ではなく日本語で表示させたい場合には以下の行を変更します。

strHTML +=  "<a id=\"ibox_close_a\" href=\"javascript:void(null);\" >Click here to close</a></div>";

                ↓

strHTML +=  "<a id=\"ibox_close_a\" href=\"javascript:void(null);\" >閉じる</a></div>";

日本語での表示

また、Internet Explorer 6でHTML 4.0 Transitional(互換モード)を指定した場合に、画像の右と下にスクロールバーが表示されてしまいます。HTML 4.0 Strict(標準モード)では問題ありません。この場合、スタイルシートファイルでは修正できないため、スクリプトファイルを修正する必要があります。これは以下の部分にある「e.style.overflow = "auto";」を「e.style.overflow = "hidden";」に変更します。

setIBoxContent = function(str) {
    clearIboxContent();
    var e = getElem('ibox_content');
    e.style.overflow = "auto";
    e.innerHTML = str;

}

    ↓

setIBoxContent = function(str) {
    clearIboxContent();
    var e = getElem('ibox_content');
    e.style.overflow = "hidden";
    e.innerHTML = str;

}

iBoxはシンプルなため、いまいち見栄えがよくありません。写真のまわりのグレーの枠の部分に背景画像や背景パターンを指定したい場合にはibox.cssファイルの以下の#ibox_wrapper部分でbackground-imageまたはbackgroundを指定し、表示させたい画像のURLを指定します。

#ibox_wrapper {
    position: absolute;
    top: 0px;
    left: 0px;
    z-index:1000;
    padding:10px;
    border:1px solid #CCC;
    width:300px;
    height:300px;
    padding-bottom:30px;
    margin:0;
    background-image:url(bg.gif);
}

iBoxはやや古いライブラリですが、通信コストなどの面ではメリットがあります。派手なエフェクトなどを必要とせず、素早く画像を表示させたい場合には利用価値があるでしょう。