解决FLASH遮住其他层元素问题 - Web前端

刚做了个幻灯片广告，产品人员需要在第一个位置放FLASH，然后其他的都是图片，但是幻灯片切换到第一张的时候，圆圈tab元素不见了，只有在谷歌浏览器下面正常，用firebug看是被flash盖住了，，用定位和z-index设置始终没办法解决。

后面换了个思路想了下，发现是Flash透明问题，顿时觉悟了。

导致原因：flash默认是在最高层的（和Object如网页播放器，弹出菜单一样），但是flash可以有通过设置放到层的下面。下面介绍下方法吧，先看下截图:

正常情况：

不正常情况：

解决方法：

<object width="950" height="235" style="visibility: visible;" id="flash_contAIner_1" data="http://testWEB1.24k.hk:8090/upload/ad/20130725101702.swf" type="APPlication/x-shockwave-flash" ></object>在flash插件里面加个wmode="transparent"属性即可，此属性是设置flash透明的。

既然提到wmode，就说下他的三个属性：

wmode 属性/参数值：window | Opaque | Transparent
模板变量：$WM
说明：
“Window”在 Web 页上用影片自己的矩形窗口来播放应用程序。“Window”表明 Flash 应用程序与 html层没有任何交互，并且始终位于最顶层。
“Opaque” 使应用程序隐藏页面上位于它后面的所有内容。
“Transparent”使 HTML 页的背景可以透过应用程序的所有透明部分进行显示，这样可能会降低动画性能。
“Opaque windowLess”和“Transparent windowless” 都可与 HTML 层交互，并允许 SWF文件上方的层遮蔽应用程序。这两种选项之间的差异在于“Transparent”允许透明，因此，如果 SWF 文件的某一部分是透明的，则SWF 文件下方的 HTML 层可以透过该部分显示出来。

如果忽略此属性，默认值为 Window。仅适用于 object。

好啦，写完收工~~~