プルダウンメニューが動画の下に隠れる

質問

ジャバスクリプトで作成したプルダウンメニューがXPのIE8だとYOUTUBEの動画の下に隠れてしまいます

YOUTUBEのタグに「wmode=transparent」をいれているのですがこの他にもなにかいれなければいけないのでしょうか？

<iframe width="396" height="236" src="http://www.youtube.com/embed/xxxxxx?wmode=transparent&rel=0" frameborder="0" allowfullscreen></iframe>

その他のWINのクロームやその他のブラウザでは大丈夫なのです（MACはサファリ／クロームで通常に動作します）

よろしくお願いいたします

回答No.1

ORUKA1951 · ベストアンサー

何がいけないというよりIE8のバグです。
親コンテナブロックにもz-indexを指定するとか
HTMLやスタイルシートの設定が分かりませんので、検索して該当するものを探してください。
　⇒ie8 z-index バグ - Google 検索( https://www.google.co.jp/#safe=off&hl=ja&sclient=psy-ab&q=ie8+z-index+%E3%83%90%E3%82%B0&oq=IE8+z-index&gs_l=hp.1.1.0l2j0i30l6.1940.6893.0.9676.11.7.0.4.4.0.422.1525.0j5j0j1j1.7.0...0.0...1c.1.9.psy-ab.jXSRTArkNBw&pbx=1&bav=on.2,or.r_qf.&bvm=bv.45512109,d.aGc&fp=3091af48596fe9ff&biw=1024&bih=592 )

補足

バグですか・・・いただいたURLでいろいろ見てみたのですがどうしたらよいのかどうしてもわかりませんでした・・・
プルダウンのメニューのCSSは下記となるのですがこの部分にz-indexなどを指定すればよいのでしょうか？

もしくはIE９にすれば大丈夫なものでしょうか？

よろしくお願いいたします

ーーーーーーーーーーーーーーーーーーーーーーーcss

@charset "utf-8";

.dropdownmenu {
width: 571px;
height: 44px;
}

#ddR1 {
list-style-type: none;
margin: 0;
padding: 0;
}

#ddR1 li,
#ddR1 li a {
width: 93px;
float: left;
z-index: 10;
}

#ddR1 .ddR2 {
list-style-type: none;
margin: 0;
padding: 0;
filter:alpha(opacity=50);
-moz-opacity: 0.5;
opacity: 0.9;
}

#ddR1 .ddList .ddR2 {
display: none;
padding-left: 4px;
}

* html #ddR1 .ddList .ddR2 {/*IE6*/
position: absolute;
display: none;
}

* html #ddR1 .ddList .ddR2 .ddList {/*IE6*/
position: relative;
top: 10px;
display: none;
left: -50px;
}

#ddR1 .ddList:hover .ddR2 {
display: block;
position: relative;
width: 93px;
height: 10px;
}