How can I make iframe respect z-index in IE?

Question

I have a youtube iframe element in my website, but it\'s next to my menu items. When I hover over a menu item, a submenu opens that partially covers the iframe (because of i

Answer 1

There are several issues with this question. First of all, there is no problem in IE to set an iframe above or below other content in your document using z-index. Higher z-index makes your iframe above other elements, (as usual), as far as your iframe is positioned: relative, absolute or fixed.

The real problem comes when the content of your iframe is a flash embedded object. In this case, the flash object can only be z-positioned if its wmode parameter is set to "transparent" or "opaque", but it will not work if the flash is included in the HTML document using wmode = "window".

So if you are including an external resource (in a website you don't have access, like youtube), you can only achieve it if any of those modes are used. If you are loading a flash object in a iframe in which you can modify its content, just check that:

is set.

In case youtube is using "window" mode, you can always use your own flash player and hook youtube videos dynamically, setting your flash object mode to transparent.