如何穿透层？(附超简单代码)

你的意思是：鼠标移动到层上面的时候，对应的层就浮到最下面来吗？
如果是不改变Z-index的话，你试试把position 设置为绝对，调整top left .试试行不，　忘了行不了，　LZ自己试一下吧。

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

不好意思漏了一个样式，应该是这样的<HTML>
<HEAD>
<style>
div{
border:1px solid red;
width:100px; height:100px;
position:absolute;
}
#L1{
background-color:green;
width:300px;
height:300px;
z-index:1;
}
#L2{
width:50px;
height:50px;
background-color:blue;
cursor:pointer;
left:200;
top:200;
z-index:2;
}
#L3{
left:0;top:0;
width:400px;
height:400px;
z-index:3;
filter:alpha(opacity=10);
background-color:blue;
}
</style>
</HEAD>
<BODY>
<div id="L1" onclick="alert(this.innerText)">Layer1</div>
<div id="L2" onclick="alert(this.innerText)">Layer2</div>
<div id="L3">Layer3</div>
</BODY>
</HTML>
Layer3是一个有背景色的，透明度为10%的层！
我要达到的效果就是和没有这个层一样。穿透此层。
还是不明白你这个正可以做到让鼠标可以移动到layer2位置能正常变为手指型，并且点击可以激活Layer1和Layer2层的事件
确定Layer3的样式为
#L3{
left:0;top:0;
width:400px;
height:400px;
z-index:3;
filter:alpha(opacity=10);
background-color:blue;
} 吗？
在这个样式下Layer2和1是被遮住的情况，无法激活事件啊！
直接复制你样式的
又没做任何修改只不过我的文件头是
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
我研究了一下，
是这样，如果遮盖的这一层有position:absolute; ,则无法进行穿透，如果没有position:absolute; 则无需任何设置可以直接穿透
例子代码如下
<style>
#L2{
left:0;top:0;
width:50px;
height:50px;
z-index:3;
top:200;
left:200;
filter:alpha(opacity=10);
background-color:green;
position:absolute;
}
#L3{
left:0;top:0;
width:400px;
height:400px;
z-index:3;
filter:alpha(opacity=10);
background-color:blue;
/*position:absolute; 加上这个就不行了，无法进行穿透*/}
</style>
<SCRIPT>
function   showSrc(){
  alert("ok");
}
</SCRIPT>

<div id="L2" onclick="showSrc()" style="cursor:pointer"></div>
<div id="L3"></div>
那你就设置position  的属性不就完了吗？在onmouseover onmouseout 里面设置。
这个和position:absolute;无关，是因为注释了这行把层3移动到下面了，没有遮挡层2.如果层3有遮挡层2，而且有透明度的话，楼主要求的效果，我想知道下，做个记号：）有一种方法，不过觉得不妥：
层3加onclick时间触发层2的onclick事件。
这是做不到的，一定是最上层的元素响应鼠标事件的。从视觉效果上来说，你把A叠在B上面，并且把A透明度设置为20%，和把B叠在A上面，并且把B透明度设置为80%，是一样的，看不出任何区别来。所以，你不如把下面的层换到上面来，然后把它们设置为半透明。
我iframe 百度只是一个例子，实际上我是iframe自己站的一个页面，iframe页面包含了一些图，点图可以链接到其他地方。
这个iframe前面有个半透明的文字介绍div,因为美观考虑我必须将这个div于iframe重叠，
因为这个div是纯文字性质的，只是介绍，但是挡住了下面的图的链接，导致下面的图没法点了。
所以我想可以“穿透”这个div,只是显示文字介绍就可以，不影响我点下面的图。不知道各位能否明白。
我画了个图，大家看看
http://clip2net.com/clip/m10494/1238912236-clip-63kb.jpg
你这种想法,用纯css完全没有办法实现,只要图层有background值,那么他就是一个完整的长方形形式的块,就算他半透明,却实际存在了的
另外考虑到另一点,就是被拦iframe中的内容因该是无法预见的,所以又导至你使用js都无法达到你所需要的效果最后只有一个方法,那就是给iframe框架进行整体的透明设置,不过这个好像以现有css无法做到一样,我曾经在金山联盟看到过个效果,就在iframe框架进行了整体页面百分比缩放效果,那个不知道现在还存在不,不过可以上百度或其它地方找找相关资料
可以!点击div时获取事件坐标,通过遍历iframe页面中的所有a标签,获取对象的offsetHeight offsetLeft  offsetTop offsetWidth和事件坐标做比较,如果在范围内,就调用对象的click事件。
这是做不到的，如果你没有屏蔽事件的传播，子事件可以传给父，但同级间是不行的.看这样的结构
<div id=i1>
<div id=i2></div>
</div>
<div id=i3></div>i2的事件可以传给i1最上传给document，但i2的事件不能传给i3
这在javascript里叫“冒泡型事件”
20楼是明白人。目前我就是被这个“冒泡事件”困扰。这个展现内容的层不局限于iframe
div无法传递事件给同层或者非父层。我在一个游戏里看到他实现了。但不知道如何做到的。测试帐号：
http://sg.dipan.com/
帐号yayaha123 密码 123456
登录后地址转到 http://sg17.dipan.com/login
即可进入游戏后点『地图』，可以看到左下方的文字聊天区域不会遮住下面的地图，鼠标移动到被遮住的建筑上同样可以触发事件。我不知道他是如何实现的。如果弄清楚了，和这个百分贴一起结
http://topic.csdn.net/u/20090331/12/387d9297-3da6-4074-87a1-6e8f2557882f.html
谢谢各位！ :))
地图分块？是什么意思？根据鼠标坐标，你的意思是做onmouseover事件
然后即时的判断
if(x==300&&y==200){
   触发事件...
}这样？会不会负荷太大了？
由于同级的一个块在另一个块下是探测不到事件的，因此可以使用mousemove，或使用setInterval，电脑做逻辑判断是非常快的，并且适时添加删除事件，就不用担心“负荷”。
我看过他的代码了,确实是记录地图坐标形式来达到穿层效果的,在聊天窗口的div放上 onmousedown="return false;"事件还有很多地方<img src="http://3gmap.dipan.com/Statics/Images/v.gif" onmousedown="return false;" usemap="#area" width="990" height="540"><map name="area" id="area">     <area id="a_0_1474405_1" shape="poly" coords="899,37,944,1,989,37,945,73" onmousedown="return false;">     <area id="a_1_1475717_1" shape="poly" coords="809,36,854,0,899,36,855,72" onmousedown="return false;">等代码,楼主可以使用firefox,查看选中代码功能,查看当前页面内存中的代码
忘了说明一下,使用iframe框架页就不能完成这个工作了,父窗口不能传值子窗口