久しぶりにThickBoxを使ったのですが、以前の事をすっかーり忘れて、「あれ？ブラックアウトしない？？」と小一時間悩む。
実は、MacのFirefoxの場合、そのままじゃブラックアウトしないのです。
ThickBoxは「thickbox.js」または圧縮版の「thickbox-compressed.js」と「thickbox.css」、ローディング画像の「loadingAnimation.gif」があればOKという解説が多く、jQuery逆引きマニュアルでも、特に解説はされていないようです。･･･が、閲覧環境がMac Firefoxの場合、これだけでは足りないのです。
公式サイトに行きますと、「macFFBgHack.png」が必要であると書いてあります。
この画像をダウンロードしてパスを書き換えないと、Mac Firefoxの環境下ではモーダルは表示されるものの、背景はブラックアウトしません。
「loadingAnimation.gif」のリンクは「thickbox.js」または圧縮版の「thickbox-compressed.js」内にあり、画像を格納した場所のパスに変更する必要があります。
だいたい8行目付近
var tb_pathToImage = "images/loadingAnimation.gif";
とあるので、ここを書き換えます。
この時、パスはjsファイルから見た位置ではなく、このプラグインを使うhtmlから見た位置のパスを書きます。
「macFFBgHack.png」に関しては「thickbox.css」内の37行目付近
.TB_overlayMacFFBGHack {background: url(../images/macFFBgHack.png) repeat;}
の部分を「thickbox.css」ファイルから見た画像の位置でパスを書き換えます。
すっかり忘れて、小一時間考えてしまったのでメモ書き。