jQuery * ThickBox * 画像とhtmlのダイアログ * 別ファイル読み込み：何年たってもひよこプログラマ：So-netブログ

	ブログをはじめるログイン

jQuery * ThickBox * 画像とhtmlのダイアログ * 別ファイル読み込み　[web] [編集]

いい加減jQueryの１つでも覚えとこうと思って
趣味サイトにサムネイルクリックでモーダルダイアログが出るよっていう
よくあるPOPUPを入れてみました。

jQueryってよく見るのは、画像とか全部ページ内に読み込んでおくのが多くて・・・
それが嫌　＆　HTMLも読み込みたかったのもあって
下記を条件でプラグインを探してみました。

　・別ファイル（HTML)、画像をURLから読み込める
　・IE、Chromeで動く（Firefoxは面倒なので（インストしてないので）確認しなかった・・・）
　・親画面をロックしない
　・画像とHTMLの混在グルーピングが出来る（prev,next）

さらっと探した時点では
　◎　別ファイル（HTML)、画像をURLから読み込める
だったのが下記

■top_up
■ThickBox （もう開発が終わってる古いプラグインらしいけど・・・）

top_upはIEで上手く動かなかったので☓。
というわけでThickBox採用。
ただしデフォルトでは
　◎　別ファイル（HTML)、画像をURLから読み込める
　◎　IE、Chromeで動く（Firefoxは面倒なので（インストしてないので）確認しなかった・・・）
　☓　親画面をロックしない
　☓　画像とHTMLの混在グルーピングが出来る（prev,next）
でした。
うーんとりあえずこのまま入れ込みました。

しかし

サイトでPOSITIONやらMARGINやらがつがつ指定したDIVぶち込んでるせいか
ダイアログの出る位置がIEとChromeで全然ちがう。

ここだけはcssとjsで位置指定してた箇所に手を加えて、ブラウザで違う処理を通るようにしました。
（クラス：TB_Window　だったかな？）

Chromeだけでいいならtop_upの方がエフェクトも綺麗だし、色々設定選べていいかも。
　◎（選べる）　親画面をロックしない
　◎　画像とHTMLの混在グルーピングが出来る（prev,next）
※　ちなみにtop_upとThickBox はライセンスが違います