Thickbox(その3)

ラジオから、ヨーロッパの「The Final Countdown」が流れました。
懐かしい。
「ざ、ふぁ〜いな〜る 、か〜んた〜ん♪・・・」

Thickbox導入時の事を書いておきます。(自分が忘れないために)

ご存じの通り、こちらからダウンロードしました。
jQueryライブラリに関して全く知識がないのですが、とりあえずjquery-latest.jsをダウンロードさせてもらって、jquery.jsと名前を変えてアップロードしました。
loadingAnimation.gif、thickbox.cssはそのままアップロード。
thickbox.js内のloadingAnimation.gifへのパスを絶対パスに変更してアップロード。
Thickbox導入予定のHTMLの<head>〜</head>内に、jquery.jsとthickbox.jsとthickbox.cssへのパスを追加しました。

私はHTMLを表示したかったので、
<a href=”HTMLのパス?keepThis=true&TB_iframe=true&height=縦幅&width=横幅” title=”タイトル” class=”thickbox”>画像</a>

上記の作業で何とか「Thickboxもどき」になりました。

「Thickboxもどき」です。

何かおかしい。
どうも、もともとのcssがおかしくなってしまい、レイアウトが崩れました。
原因はいろいろあるのでしょうけど、追求する気力がなかったので(ロールオーバーボタンのjavascriptと相性が悪いのかな?)、そのHTML内に必要なスタイル(おかしくなってしまったスタイル)を書き込みましたら、上手くいきました。
あと、thickbox.cssの一番最初のbodyのスタイルがheight:autoだと、まだまだ「Thickboxもどき」でしたので、height:100%に変更しました。

以上でなんとかお見せする事が出来るようになりました。

背景が真っ黒の携帯壁紙を作りました。

背景真っ黒トランプ模様 背景真っ黒ゆりの紋章 背景真っ黒蝶

ダウンロードは上の画像を保存して下さい。240×400pxです。

Pocket