关于Flash遮盖Div的解决方案 2011.12.23

      今天在做公司项目时候,发现的这个问题在IE下div被flash遮盖住了。Firefox、Chrome,表示毫无鸭梨。法克!该死的IE,问题来了,果断要处理啊!所以在这里小前把解决方案分享给coder们,和大伙儿一起学习,一起进步。

可以给flash控件添加wmode属性,值为transparent或opaque,针对不同浏览器写法上有所差异:

//embed标签:支持Firefox、Chrome等Mozilla系列或Netscape插件的浏览器
<embed width="480" height="400" type="application/x-shockwave-flash" src="http://player.youku.com/player.php/sid/XMzI4NDEwODky/v.swf" allowfullscreen="true" quality="high" allowscriptaccess="always" wmode="transparent" />
 
//object标签:只支持IE系列或其它Activex控件的浏览器
<object width="300" height="300" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0">
<param name="quality" value="high" />
<param name="src" value="wmode.swf" />
<param name="wmode" value="transparent" />
</object>

这里我们解释下flash控件wmode属性的这两个值,transparent、opaque。
1、opaque和transparent基本上差不多,只是在某些特殊情况下有点不同。
2、opaque在flash中需要用到输入法时输入法软件会定位不准。
3、transparent在同一页面中用得太多的话会有性能问题。

//最后我们顺带说下flash兼容,为了确保大多数浏览器能正常显示flash,最好在embed标签外面包裹object标签,这样IE,FF都能识别到。以下是兼容大多数浏览器的写法:
<object width="300" height="300" classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,40,0">
<param name="quality" value="high" />
<param name="src" value="wmode.swf" />
<param name="wmode" value="transparent" />
<embed width="480" height="400" type="application/x-shockwave-flash" src="http://player.youku.com/player.php/sid/XMzI4NDEwODky/v.swf" allowfullscreen="true" quality="high" allowscriptaccess="always" wmode="transparent" />
</object>

发表评论