问题
我尝试在SVG中嵌入YouTube视频。在Ubuntu的Chromium上,它按预期工作,但是在Windows 7的Google Chrome上,播放时视频会移动到画布的前面,然后在播放停止时返回其原始位置。
有人知道为什么视频似乎改变了它的z-index,并且如何阻止它?
还有一个次要问题(在我的情况下稍微不那么紧迫),Firefox在播放视频时只显示音频而没有视频。
代码
我使用以下HTML来嵌入视频:
<svg height="600" version="1.1" width="550" xmlns="http://www.w3.org/2000/svg">
<foreignObject x="10" y="10" height="300" width="500">
<div xmlns="http://www.w3.org/1999/xhtml">
<iframe xmlns="http://www.w3.org/1999/xhtml" width="500" height="300"
src="http://www.youtube.com/embed/jOV1-mkIOd0?wmode=opaque"
frameborder="0">
</iframe>
</div>
</foreignObject>
<circle cx="250" cy="250" r="150" fill="#ff0000"></circle>
</svg>
我创建了一个演示问题的 演示版。