Click here to Skip to main content
Click here to Skip to main content

Embedded YouTube videos z-index problem while playing

By , 29 Jan 2013
Rate this:
Please Sign up or sign in to vote.

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: 

<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)

About the Author

Veera Prathap Annem
Software Developer
India India
Give me six hours to chop down a tree and I will spend the first four sharpening the axe.

Comments and Discussions

 
-- There are no messages in this forum --
| Advertise | Privacy | Mobile
Web03 | 2.8.140421.2 | Last Updated 29 Jan 2013
Article Copyright 2013 by Veera Prathap Annem
Everything else Copyright © CodeProject, 1999-2014
Terms of Use
Layout: fixed | fluid