I experience the very known flash / html overlay issue in Google Chrome (16.0.912.75 m) and Safari (5.1.1). As suggested here and here I have set the wmode
attribute to transparent
- and tried opaque
, as well. Unfortunately both didn't do the trick.
I have also added type="application/x-shockwave-flash"
like it is suggested here
Here is the code currently responsible for the embedding.
<iframe wmode="transparent" type="application/x-shockwave-flash"
width="760" height="427"
src="http://www.youtube.com/embed/Xedbog6_3L0?rel=0&hd=1?wmode=transparent"
frameborder="0" allowfullscreen=""/>
First of all, this problem is not reproductive in Safari 5.1.2 and Firefox 9.0.1 (Mac versions). Without knowing your browser, I can only say that since you are using an iframe
tag to point a page where Flash is actually embedded, wmode
has no effect in your current DOM document, as it is not a valid property of iframe
tag (it belongs to embed
tag). You'd need to set css property display
to block
value on the iframe
tag in order to to make a browser treat your iframe
as a standard layout object. Then, you could set the layer distribution and positioning via CSS.