Flash画像がポップアップ拡大画像の上に重なって表示される

2012-04-10 15:55

下記の箇所にFlashを挿入いただいてる場合に、商品詳細ページにてポップアップ拡大画像より上にFlashが重なって表示される場合があります。
・キャッチフレーズ欄
・左エリア自由記入欄
・商品詳細ページ説明欄

・コピーライト欄
その場合は、下記の点をご確認ください。

※なお、下記FAQの方法でご利用いただいている方は、弊社のJavaScript内にwmode指定を追加しておりますので問題ございません。
https://www.ocnk.net/faq/index.php?action=artikel&id=221

objectタグ、embedタグを利用しwmodeを指定していない場合
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#
version=6,0,29,0" width="100" height="100">
<param name="allowScriptAccess" value="always">
<param name="movie" value="swfファイルurl">
<param name="quality" value="high">
<embed src="swfファイルURL" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer"
type="application/x-shockwave-flash" width="100" height="100" allowScriptAccess="always">
</embed>
</object>
<param name="wmode" value="transparent"> とembedタグ内にwmode="transparent"を追加してください。
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000"
codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#
version=6,0,29,0" width="100" height="100">
<param name="allowScriptAccess" value="always">
<param name="movie" value="swfファイルurl">
<param name="quality" value="high">
<param name="wmode" value="transparent">
<embed src="swfファイルURL" quality="high" wmode="transparent" pluginspage="http://www.macromedia.com/go/getflashplayer"
type="application/x-shockwave-flash" width="100" height="100" allowScriptAccess="always">
</embed>
</object>

なお、Flashの挿入には、下記のFAQのようにJavaScriptをご用意しておりますので、下記のご利用を推奨いたします。

 

外部サービスのFlashをJavaScriptで読み込んでいる場合
外部サイトで提供されているJavaScriptにてFlashを読み込んでいる場合は、wmodeによる制御ができませんので、商品詳細ページでは非表示にしていただく必要があります。
下記のように、divタグを設定いただくことで、商品詳細画面でポップアップ拡大画像が開いている時のみFlashを非表示にすることができます。
<script language='JavaScript' src='外部サービスjsファイルURL'></script>
下記のように該当の<script>~</script>部分をすべて
<div class="flashdisplay"></div>で囲んでください。
※必ずclass名で、class="flashdisplay"を付けてください。
<div class="flashdisplay">
<script language='JavaScript' src='jsファイルURL'> </script>
</div>

 

Youtubeのiframeの埋め込みコードをご利用の場合
<iframe width="xxx" height="xxx" src="http://www.youtube.com/embed/xxxxxxx" frameborder="0" allowfullscreen></iframe>
下記のように?wmode=transparentを追加してください。
<iframe width="xxx" height="xxx" src="http://www.youtube.com/embed/xxxxxxx?wmode=transparent" frameborder="0" allowfullscreen></iframe>