Youtube Embed Overlap Issue [Resolved]

Keith Curreri - Blog Headshot

By Keith Curreri on October 11, 2011

Are you having issues with things overlapping your embedded Youtube videos? I recently embedded a Youtube video on a website and saw that my CSS drop down menus were overlapping the video. I tried setting some z-indexes and didn’t have much luck. Luckily I stumbled on a simple solution.

The Solution

Just add ?wmode=transparent to the end of the Youtube URL. For example:

Before

<iframe width="480" height="360" src="http://www.youtube.com/embed/oHg5SJYRHA0" frameborder="0" allowfullscreen></iframe>

After

<iframe width="480" height="360" src="http://www.youtube.com/embed/oHg5SJYRHA0?wmode=transparent" frameborder="0" allowfullscreen></iframe>

Yep, that’s all it takes!

2
Leave a Reply

avatar
1 Comment threads
1 Thread replies
0 Followers
 
Most reacted comment
Hottest comment thread
2 Comment authors
KeithBethany Recent comment authors
  Subscribe  
Notify of
Bethany
Bethany

This worked for me. Thanks for sharing!

Keith
Keith

Great Bethany, glad I could help!