最顶层div被flash或者下拉列表遮挡的问题解决 | 2009-5-14 17:14:00
0
推荐对于下拉列表,只要在层中加入一个和层相同大小的<Iframe>就可以了。具体做法如下:
<DIV>
<!--//原来的内容//-->
<IFRAME width="100%" height="100%" style="position:absolute; top:0px; z-index:-1; border-style:none;"></IFRAME>
</DIV>
这个方法对于透明的或外形不规则的层无效。
--------------------------------------------
FLASH默认是在DIV层之上的,这样会使置最顶层的DIV被flash遮挡,我们可以作下面设置,在FLASH的两个object之间加一个,就行flash置于div之下了
<object>
<param name="wmode" value="Opaque">
<param name="wmode" value="transparent">
</object>
如何将DIV置于最顶层请看
div+css使flash置于顶层
你可以用 深度(z-index)试试。下面是举的一个小例子:
#a{
position:absolute;
top:80px;
left:100px;
z-index:1;
}
#b{
position:absolute;
top:70px;
left:160px;
z-index:0;
}
以z-index的数值大小为准,大值对象的层级位于小值对象之上。
flash透明代码是:<param name="wmode" value="transparent">
有时在网页中需要将flash所在层设为底层,以免flash将其它div覆盖,具体方法如下,主要分两步:1将flash所在div的z-index值设为-1; 2将flash设置为不透明.
实例:
这是因为Flash默认是最高层. 所以, 经常会遇见Flash把下拉菜单挡住的情况. 把Flash文件放到一个层中,设为最底层,FLASH设为透明.
<div style="z-index:-1"> <!--1.设置FLASH为底层-->
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://xxx.xxx.xxx" width="200" height="115">
<param name="movie" value="media.swf">
<param name="quality" value="high">
<embed src="media.swf" quality="high" pluginspage="http://xxx.xxx.xxx" type="application/x-shockwave-flash" width="200" height="115"></embed>
<param name="wmode" value="Opaque"> <!--2.必须把FLASH设置为不透明-->
flash覆盖div(层)解决方案2009-06-23 14:17有两种方法:
一种就是设置flash为透明:
但是如果你在DW中插入动画,再加
<param name="wmode" value="transparent">
是不生效的。要把整个的flash插件代码换成如下:
<object type="application/x-shockwave-flash" data="" width="560" height="210">
<param name="movie" value="" />
<param name="wmode" value="transparent" />
</object>
对比一下,和DW自动生成的代码是有区别的,测试过,IE FF 均可以。
第二种方法:
设置flash置底,加个代码:<param name="wmode" value="opaque" />
但是只加这个代码,IE可行,在FF下,失效。要想在FF下起作用,还要用在<object 里加个 wmode="opaque" ,实例代码如下:
<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="" width="560" height="210">
<param name="movie" value="" />
<param name="quality" value="high" />
<param name="wmode" value="opaque">
<embed src="" wmode="opaque" quality="high" pluginspage="" type="application/x-shockwave-flash" width="560" height="210"></embed>
</object>
另外一种方法是:
将flash object 改变
<style>
div {
width:100px;
height:100px;
position:absolute;
top:20px;
left:20px;
background:red
}
object {
width:400px;
height:100px;
}
</style>
<div>aaaa</div>
<object type="application/x-shockwave-flash" data="">
<param name="movie" value="" />
<param name="wmode" value="transparent" />
</object>