在Internet Explorer中使用mousemove的问题 [英] Issue with mousemove in Internet Explorer

问题描述

当事件目标位于< img> 元素上且缺少背景时，Internet Explorer不会触发onmousemove事件。

Internet explorer does not fire onmousemove events when the event target is positioned over an <img> element and lacks a background.

但它确实在目标具有背景时注册事件。有没有人对此有解释？我在IE10，IE9和IE8中有相同的行为。

But it does register the event when the target has a background. Does anyone have an explanation for this? I had the same behavior in IE10, IE9, and IE8.

这里小提琴：
http://jsfiddle.net/xSpqE/2/

推荐答案

当OP询问原因时，这是我的突破：

As OP asked for a reason, here's my breakthrough:

更直观地解释，所以首先让我们为 img <添加一个点击处理程序/ code> s：

It's easier to explain visually, so first off let's add a click handler to the imgs:

$('img').click(function() {
  $('.pageX').text('img clicked!');
});

小提琴

足够公平。您点击Chrome / Firefox / not-IE浏览器中的图片，因为绝对定位的 div 覆盖它，所以不会发生任何事情。

Fair enough. You click the image in Chrome/Firefox/not-IE browsers and nothing will happen as the absolutely positioned div covers it.

现在在IE上试试吧。 img 的点击处理程序被触发了！因此，它表明IE通过绝对定位的透明（无内容或背景）元素推送元素。更有趣的是，相对定位的元素遇到同样的问题，并且在两个/两个元素上设置 z-index 也不会解决它。当然，由于图像位于叠加层上方，因此不会触发叠加层的 mousemove 事件。

Now try it on IE. The img's click handler is fired! Therefore it shows that IE pushes elements through absolutely positioned "transparent" (no content or background) elements. More interestingly, relatively positioned elements suffer the same issue and setting z-index on either/both elements won't solve it either. Of course, as the image is above the overlay, it won't trigger the overlay's mousemove event.

解决方法是为叠加层提供一些填充，例如背景：rgba（0,0,0,0）将强制IE将绝对定位的元素保持在顶部。 小提琴 。如果您需要支持没有rgba支持的浏览器，请使用1x1px透明gif作为背景。

An workaround is to provide some "filling" to the overlay, say background:rgba(0,0,0,0) will force IE to keep the absolutely positioned element at the top. Fiddle. If you need to support browsers without rgba support, use a 1x1px transparent gif as background.

我从未在任何规范中看到此定义，也未正式报告为错误。没有内容或背景的绝对定位元素没有逻辑或理由遭受这个z索引问题，因此我将其称为另一个IE错误。也许在 Microsoft论坛上报告它是有用的。

I've never seen this defined in any spec nor officially reported as a bug. There's no logic or reason for absolutely positioned elements without content nor background to suffer this z-index issue, hence I'll call it yet another IE bug. Maybe reporting it on the Microsoft forums would be of use.

此外，相关问题： IE bug：具有不透明背景颜色的绝对定位元素

这篇关于在Internet Explorer中使用mousemove的问题的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！