css Archive
- 2008.10.11 Sat
css | flash : z-indexを有効にしてFlashの上にプルダウンメニューを表示する
今まで知らなかったのですが、Flashなどを貼り付ける際に使うobjectタグやembedタグには通常状態だとz-indexが効かないようです。
そのため、JavaScript+CSSで表示させているプルダウンメニューがFlashの下にもぐりこんでしまいました。プルダウンメニューはユーザビリティ的にあまりよろしくなさそうなので個人的にはあまり使いたくないもののひとつなのですが、今はそれはさておき。
これを解決するにはobject,embedタグを使うときに一手間かける必要があります。
<object classid="@@" codebase="@@" width="@@" height="@@ id="@@" align="@@"›
<param name="allowScriptAccess" value="sameDomain" /›
<param name="wmode" value="transparent" /›
<param name="movie" value="@@.swf" /›<param name="quality" value="high" /›<param name="bgcolor" value="#ffffff" /›<embed src="@@.swf" quality="high" bgcolor="#ffffff" width="@@" height="@@" name="@@" align="@@" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="@@" wmode="transparent"/›
</embed›</object›
<param name="allowScriptAccess" value="sameDomain" /›
<param name="wmode" value="transparent" /›
<param name="movie" value="@@.swf" /›<param name="quality" value="high" /›<param name="bgcolor" value="#ffffff" /›<embed src="@@.swf" quality="high" bgcolor="#ffffff" width="@@" height="@@" name="@@" align="@@" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="@@" wmode="transparent"/›
</embed›</object›
上記の太字で示した部分を追加することで、z-indexが有効になります。
- Comments: 2
- Trackbacks: 0
- Search
- Feeds
- Meta