YouTube Video in IFRAME covers drop-down navigation

[tonyroberts]

Greetings,

I added a YouTube video in an IFRAME to the top of this page. Seems to work fine, but dropdown items from the navbar below the header go behind the IFRAME and are not visible. (This occurs in IE and Chrome. In Firefox, the nav items appear on top of the video.)

I've tried experimenting with the z-index of the iframe, but I haven't hit on anything that makes any difference on IE or Chrome.

Any ideas? Thanks.
Tony

[drake]

This is not a bug. See this topic.

[tonyroberts]

Thank you drake. Sorry if I misclassified this as a bug. I am aware of z-index and, as I explained, had try to use it to solve this problem.

[drake]

Search for terms "flash z-index" - isn't z-index from css, in that way is named the behaviour that you see
You need to add a new parameter - wmode - in the code for embedding video - you will see.

[tonyroberts]

Thank you for the additional information. Now that I understand what's happening, the info in the other thread you mentioned is much less cryptic.

To sum up, after removing the CSS z-index calls I had experimented with, adding &wmode=transparent to the end of YouTube's URL did the trick.

[ShocK]

Just add this to the end of the videos url: “?wmode=transparent”

So the code will now look like this:
<'iframe width="560" height="349" src="http://www.youtube.com/embed/KPCe_VrrcHU?wmode=transparent” frameborder=”0″ allowfullscreen>