Html wmode 标签参数详解

原文出处：http://blog.sina.com.cn/s/blog_4532d8b50101g2sw.html

 

在网页中嵌入swf文件时，经常会用到wmode这个参数，而嵌入的swf出现的一些问题也往往与这个参数有关。今天升级IE的flashplayer后，发现网页中有的swf不能显示，刚开始以为是升级没有成功，但重装flashplayer之后还是不能显示，经过一翻周折之后，发现问题还是出在wmode之个参数上。所以在这里再简单温习一下：
wmode有五个值，分别是'window'，'opaque'，'transparent','direct'，'gpu'，后两个是对于flashplayer10及更高版本新增的和硬件加速有关的参数。

wmode='window'

缺省模式，在这种模式下flashplayer有自己的窗口句柄，这就意味着flash影片是存在于Windows中的一个显示实例，并且是在浏览器核心显示窗口之上的，所以flash只是貌似显示在浏览器中，但这也是flash最快最有效率的渲染模式。由于它是独立于浏览器的html渲染表面，这就导至flash影片总是会遮住位置与他重合的所有html元素。
需要注意的是，大多数苹果电脑浏览器会允许html显示在flash之上，但flash影片播放时会出现比较诡异的现象，比如html元素象被flash刮掉一块的样子。

wmode='opaque'

无窗口模式，在这种情况下flashplayer没有自己的窗口句柄，这就需要浏览器告诉flashplayer在浏览器的渲染表面绘制的时间和位置。这时flash影片就不会在高于浏览器html渲染表面而是与html在同一个页面上,因此你就可以使用z-index值来控制html元素在flash影片之上。

wmode='transparent'

透明模式，在这种模式下flashplayer的stage背景是透明的，flashplayer只会绘制stage上的元件，同样，你也可以使用z-index来控制flash影片的深度值，但与Opaque模式不同的是这样做会降低flash影片的回放效果，而且在flashplayer9.0.115之前的版本设置wmode='opaque'或'transparent'会导致全屏模式失效。

wmode='direct'

专为flashplayer10及以更高版本新增的参数，绕过浏览器进行渲染，相当于在独立的flashplayer中进行渲染。

wmode='gpu'

专为flashplayer10及以更高版本新增的参数，充分利用硬件来加速，但并不意味所有情况下使用此种模式都是好的，有些时候会事得其反。

注意：'direct'和'gpu'应该是与前面三个值不能同时用的，可能引起冲突或先设置的值失效。

今天遇到的问题发生在ie9浏览器：分别使用了滤镜和视频的两个flash影片，在原来的flashplayer 11.6.602.180能正常显示，但升级到flashplayer 13.0.0.214后却显示空白，后经去除wmode='transparent'参数，显示正常，当然某种情形下可能出现遮挡现象。
大多数情况下swf插入html能够得到满意解决，但个别时候可能有些纠结。