我有悬停效果菜单栏，现在我希望把透明图像与一个圆，在菜单项之一的“手绘”文本。 如果我使用绝对定位放置菜单项上面覆盖图像，用户将无法点击按钮和悬停效果将无法正常工作。
有没有办法以某种方式禁用与此叠加图像鼠标交互，使得这些菜单将继续，就像即使它是一个形象背后工作之前？
编辑：
因为菜单是与Joomla生成我不能调整只是一个菜单项。 而且即使我能，我不觉得一个JavaScript的解决方案是适当的。 所以，最后我“标记”的菜单项元素外的箭头的菜单项。 不是像你一样我希望它是，但它无论如何制定好。
Answer 1:
我发现最好的解决办法是使用CSS样式：
#reflection_overlay {
background-image:url(../img/reflection.png);
background-repeat:no-repeat;
width: 195px;
pointer-events:none;
}
pointer-events属性的作品非常好，也很简单。
Answer 2:
所以我做这个和它的作品在Firefox 3.5在Windows XP上。 它示出了具有一些文本，图像覆盖的箱，并高于一个透明的div拦截所有点击。
<div id="menuOption" style="border:1px solid black;position:relative;width:100px;height:40px;">
sometext goes here.
<!-- Place image inside of you menu bar link -->
<img id="imgOverlay" src="w3.png" style="z-index:4;position:absolute;top:0px;left:0px;width:100px;height:40px;" \>
<!-- Your link here -->
<a href="javascript:alert('Hello!')" >
<div id="mylinkAction" style="z-index:5;position:absolute;top:0px;left:0px;width:100px;height:40px;">
</div>
</a>
</div>
我做了什么：我制作一个div和尺寸它是什么样的菜单选项可以尺寸，100x40px（任意值，但它说明样品帮助）。
该div有图像叠加，和链接覆盖。 该链接包含大小是一样的“menuOption” DIV一个div。 这样，用户点击是在整个盒子抓获。
您将需要测试时提供自己的形象。 :)
注意事项：如果你希望你的菜单按钮，在响应用户交互（例如，改变颜色来模拟一个按钮），那么您将需要连接到你会调用标签上的JavaScript额外的代码，这些额外的代码可以解决“ menuOption”通过DOM和元素来改变它的颜色。
此外，还有是我所知道的，你可以采取一个点击事件，并将其可视页面元素下一个元素上注册没有其他办法。 我在今年夏天尝试过这种为好，并没有发现其他的解决方案，但此。
希望这可以帮助。
PS：关于在事件的书面记录怪异模式走了很长的方式来帮助我了解事件在浏览器中的行为方式。
Answer 3:
给按钮比手绘图像较高的Z-index属性：
<img src="hand_drawn_image.gif" style="z-index: 4">
<a href="#" style="z-index: 5"></a>
但是，一定要在所有的主流浏览器进行测试。 即，从FF解释z索引不同。 为了拿出更多的细节某人，你就必须发布更多信息，链接将是最好的。
Answer 4:
什么佩卡·盖泽说的基础上，我觉得下面的工作。 以他为榜样，返工吧：
<a href="#" style="z-index: 5">
<!-- Place image inside of you menu bar link -->
<img src="hand_drawn_image.gif" style="z-index: 4">
<!-- Your link here -->
</a>
在这里，你应该能够发生的事件对标的一个标签，除非你的形象有一个事件，将启动一个捕获（！IE浏览器），然后杀死了事件的传播。
如果您需要多一点帮助，让我们知道更多的有关情况。
Answer 5:
如果图像将被静态定位，你可以因为它冒泡，通过将img标签的菜单项元素中捕捉图像的Click事件。
<div onclick="menuclick()">
<img src="overlay.png" style="position:absolute;" />
</div>
文章来源: Ignore mouse interaction on overlay image
