您现在的位置： 365建站网 > 365文章 > 不同浏览器中Div层覆盖Flash层的几种方法

不同浏览器中Div层覆盖Flash层的几种方法

文章来源：365jz.com 点击数：1115 更新时间：2010-12-31 17:24 参与评论

通过设置Div层跟Flash层的z-index并不能使Div层覆盖Flash层。
官方解释：
A Flash movie in a layer on a DHTML page containing several layers may display above all the layers, regardless of the stacking order
(”z-index”) of those layers.
解决方案：
1. 修改flash自身属性，适用 Firefox 跟 IE
这种方案需要修改flash代码，使flash在加载时为透明的，所以div层可以覆盖这个flash。
在原来的flash代码中添加
在中添加属性 wmode＝’transparent’
a. 原始的flash代码

b. 修改后的代码

2. 修改position属性[[BR]][[BR]]
把用来覆盖Flash的Div层设置position:fixed。由于ie不支持fixed，所以这种方式只适用于Firefox。
a. 示例代码

<html>
     <head>
       <title>div cover flash with fixed property</title>
     </head>
     <body>
       <div id="cover_div" style="position:fixed;width:100px;height:100px;background-color:blue;">I cover the Flash.</div>
       <object classid='clsid:D27CDB6E-AE6D-11cf-96B8-444553540000'
        codebase='http://download.macromedia...,0,0,0'
        width='400px' height='340px'>
        <param name='movie' value='http://blog.ku6.com/ku6_v.... />
        <param name='quality' value='high' />
        <embed src='http://blog.ku6.com/ku6_v.... quality='high'
         pluginspage='http://www.macromedia.com/...
         type='application/x-shockwave-flash' width='400' height='340'>
        </embed>
       </object>
     </body>
   </html>

3. 使用iframe
使用iframe的方式可以同时支持firefox跟IE，但是实现方式略有不同。
原理都是先用iframe盖住flash，然后设置iframe的z-index使div能盖住这个iframe。
但是在firefox中iframe 默认状态下不能盖住 flash，需要将flash所在层的autoflow属性设为auto，IE下没有此问题。
a. 在firefox中的示例代码

<html>
     <head>
       <title>div cover flash with iframe</title>
     </head>
     <body>
       <div id="cover_div" style="position:absolute;width:100px;height:100px;background-color:blue;z-index:9">I cover the Flash.</div>
       <div style="overflow:auto;">
         <iframe id="cover_iframe" frameborder="0" style="position:absolute;width:100px;height:100px;z-index:8;"></iframe>
     <object classid='clsid:D27CDB6E-AE6D-11cf-96B8-444553540000'
          codebase='http://download.macromedia...,0,0,0'
          width='400px' height='340px'>
       <param name='movie' value='http://blog.ku6.com/ku6_v.... />
       <param name='quality' value='high' />
       <embed src='http://blog.ku6.com/ku6_v.... quality='high'
            pluginspage='http://www.macromedia.com/...
            type='application/x-shockwave-flash' width='400' height='340'>
           </embed>
     </object>
       </div>
     </body>
   </html>

如对本文有疑问，请提交到交流论坛，广大热心网友会为你解答！！点击进入论坛

您可能感兴趣的文章:

发表评论 (1115人查看，0条评论): 请自觉遵守互联网相关的政策法规，严禁发布色情、暴力、反动的言论。

昵称：

最新评论

------分隔线----------------------------

上一篇：当有<!DOCTYPE html时 iframe height
下一篇：怎么判断链接是网站推广中的好链接

大家感兴趣的内容

不同浏览器中Div层覆盖Flash层的几种方法

您可能感兴趣的文章:

公司信息

快速入口

其它栏目

业务咨询