2009/08/02 記事:竹田

画像をモーダルウィンドウで表示する際の落とし穴

modal.jpg

私もよくサムネイル画像から拡大画像を表示させる場合、モーダルウィンドウで行なう事が多い。ちなみにモーダルとは新規画面をポップアップ表示させて、そこにダイアログや拡大写真を表示。「クローズ」や「キャンセル」をクリックしてその画面を閉じない限り、呼び出し元の画面操作ができないようにするのがモーダルだ。最近では色々なJSライブラリが出ているが、Flashとこれらのモーダルウィンドウ用のJSライブラリを使用する場合、注意が必要だ。
どうやらIEだとFlashが一番上に表示され、モーダルウィンドウがうまく表示できない。この解決法として貼付け用のパラメータでwmodeをtransparentに設定すればFlashを背後に表示させる事ができるが、wmodeはクセ者でFlash内でのテキストフィールドで日本語がうまく入力できないという不具合が発生する。これはQUICK CARTでは致命的!私も最近気がついたのだった・・・(汗)AdobeのTechNoteでも『半角英数文字の入力は可能ですが、日本語の入力が必要なケースは wmode を transparent に設定することを避けてください。』となっている。これらを回避させる場合、何らかの形で工夫する必要がある。wmodeの使用を避け、例えばモーダルウィンドウを表示する(クリック)時にFlashオブジェクトを無効又は隠すなど。又、MacではFirefox、Safari共に普通に導入可能なので、気にする必要はない。