Click here to Skip to main content
65,938 articles
CodeProject is changing. Read more.
Articles / web / HTML

Embedded YouTube videos z-index problem while playing

0.00/5 (No votes)
29 Jan 2013CPOL 12K  
Embedded YouTube videos z-index problem while playing.

Problem Description 

If you come across embedding YouTube videos to your website, you might know this problem. When some elements in your page have a higher z-index to float on other elements, the YouTube embedded video ignores their z-index and hides them under it. 

Tip 

A simple way to solve this is to add the wmode=transparent property to the source URL of the video: 

XML
<iframe width="752" height="425" src="http://www.youtube.com/embed/O2R-ixfQtwE?wmode=transparent&rel=0&modestbranding=1" 
  frameborder="0" allowfullscreen=""></iframe>

License

This article, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)