当元素被另一个元素覆盖时，有没有办法获得一个mouseover事件？

不计算元素的位置，然后发射自己的“事件”。当元素被另一个元素覆盖时，有没有办法获得一个mouseover事件？

original fiddle (can be fixed with z-index)

better fiddle (a situation where z-index can't work)

example

<div class='under'></div> 
<div class='over'></div> 

.over { 
    display:inline-block; 
    position:absolute; 
    height:100px; 
    width:100px; 
    background: rgba(0, 255, 0, .3); 
} 

.under { 
    display:inline-block; 
    position:absolute; 
    height:26px; 
    width:26px; 
    top:37px; 
    left:37px; 
    background:rgba(0, 0, 255, 1); 
}

来源

2013-01-13 user1873073

我想不，但我可以问你为什么使用它？ –

只是要清楚，你是否想让绿色在Y盘旋的同时成为Y？ –

A [hack]（http://jsfiddle.net/GLCPV/1/）为原始案例。虽然FF中的结果似乎闪烁，但其他所有浏览器都正常工作... – Teemu

除非我已经错过了你的榜样的时候，你可以只添加一个Z-index属性来你的CSS：

.over 
{ 
    display:inline-block; 
    position:absolute; 
    height:100px; 
    width:100px; 
    background: rgba(0, 255, 0, .3); 
    z-index:1; 
} 

.under 
{ 
    display:inline-block; 
    position:absolute; 
    height:26px; 
    width:26px; 
    top:37px; 
    left:37px; 
    background:rgba(0, 0, 255, 1); 
    z-index:2; 
}

来源

2013-01-13 10:48:31

我添加了一个更具体的例子。上面的一个人给了这个链接，它看起来像一个相当不错的答案http://stackoverflow.com/questions/5855135/css-pointer-events-property-alternative-for-ie – user1873073

我最终自己计算的coords。 – user1873073

我不认为这是可能的，你可以把一个z-index的在你的CSS：

.under { 
    z-index:1; 
}

，然后修改你的JS：

under.on("mouseover", function() { 
          blue.html("Y"); 
          green.html("Y"); 
});

EDITED 错误的链接。

这里的Fiddle

来源

2013-01-13 10:48:02

谢谢这个人帮不了忙，但我需要的东西完全一样。很有帮助。 –

添加pointer-events:none;您over DIV：

.over { 
    display:inline-block; 
    position:absolute; 
    height:100px; 
    width:100px; 
    background: rgba(0, 255, 0, .3); 
    pointer-events:none; 
}

DEMO：http://jsfiddle.net/ckaPU/1/

来源

2013-01-13 10:48:46 Eli

在你的例子中，当鼠标悬停在 –

@Yusaf Khaliq上时，绿色不再起作用我只是按照OP的要求操作，这是 – Eli

突出的最简单的方法！但没有IE10或歌剧 – user1873073

当元素被另一个元素覆盖时，有没有办法获得一个mouseover事件？

回答

相关问题