メモ：IEで貼り付けたYoutubeに対してz-indexが効かない場合の対処

Youtube動画をサイトに掲載する場合、埋め込みコードをコピーしてiframeでサイト内に組み込むことが多いですよね。
ただ、その際に少し気をつけたいのがiframeで組み込んだYoutubeにはz-indexが効かない場合があるということです。
スタンダードなサイトであればそもそもz-indexが効かなくても問題なかったりしますが、例えばlightboxや上部固定のグローバルナビゲーションなどを使用する場合にはYoutubeが最前列に来てしまうと不都合です。

解決法は末尾にパラメータを追加するだけ！

この問題はYoutube側も認識しているので、埋め込みコードの末尾に下記のパラメータをくっつけるだけで解決することが出来ます。
（いっそデフォルトで実装してくれても良さそうなのに、なんで実装されないんでしょう）

&wmode=transparent

Youtubeからコピーしてきた埋め込みコードのsrc属性の末尾に、このコードをくっつければz-indexが効くようになります。

<iframe width="560" height="315" src="https://www.youtube.com/embed/Gi-jwEhtl8Y" frameborder="0" allowfullscreen></iframe>

<!--↓↓↓パラメータをくっつける↓↓↓-->

<iframe width="560" height="315" src="https://www.youtube.com/embed/Gi-jwEhtl8Y&wmode=transparent" frameborder="0" allowfullscreen></iframe>

徐々に動画を載せるサイトも増えて来ていますし、z-indexを使った表現も結構多いのでちゃんと覚えておこうと思います。

YouTubeでビジネスを加速する方法
-Amazonで見る