Mouseenter仅在IE9中透明div的边框上触发 [英] Mouseenter only fired on border of transparent div in IE9

问题描述

在我的代码中，我有一个id为'SIAinfoBox'的div，它将加载不同的细节，具体取决于鼠标当前所处的div。我将以下两个侦听器附加到每个相关的div：

In my code, I have a div with id 'SIAinfoBox' that is to be loaded with different details, depending on what div the mouse is currently over. I appended the following two listeners to every relevant div:

$(annoDiv).mouseover(function(event){
                event.stopPropagation;
                $('#SIAinfoBox').empty();
                $('#SIAinfoBox').append(details);
                $('#SIAinfoBox').css('visibility','visible');
            });
$(annoDiv).mouseleave(function(event){
                event.stopPropagation;
                $('#SIAinfoBox').empty();
                $('#SIAinfoBox').css('visibility','hidden');
            });

这些div没有背景颜色设置，但有1px纯黑色边框。在Firefox中，一切运行良好。但是在Internet Explorer中，仅当鼠标位于div的边界上时才会填充SIAinfoBox。在div中移动它似乎会触发mouseleave事件，并删除内容并隐藏div。如果我设置背景颜色，它的工作方式与预期的一样，但没有背景颜色（或透明），它不起作用。我也尝试使用mouseenter而不是mouseover，但结果相同。
为什么InternetExplorer表现得像那样，或者我该怎么做才能达到我目前在FF for IE中得到的结果呢？

These divs have no background-color set, but have a 1px solid black border. In Firefox, all works well. But in Internet Explorer, the SIAinfoBox is filled only when the mouse is over the border of the div. Moving it inside the div seems to fire the mouseleave event, and the content is removed and div hidden. If I set a background-color, it works like it is expected to, but with no background-color (or transparent) it does not work. I have also tried using mouseenter instead of mouseover, but with the same results. Why does InternetExplorer behave like that or what can I do to achieve the results I am currently getting in FF for IE, too?

推荐答案

我有类似的IE相关问题，比如这个 - 你可以制作
透明png并将背景设置为url（images / transparent.png）
重复滚动0 0透明 - SmokeyPHP

I've had similar IE related issues such as this - you could make a transparent png and set the background to "url(images/transparent.png) repeat scroll 0 0 transparent" – SmokeyPHP

没有找到他的评论，所以我把它移到这里作为答案。可以在下方链接找到透明图片：

Didn't find his comment first so I moved it here as answer. A transparent image can be found with below link:

答案： style =background：url（images / transparent.png）重复滚动0 0透明

Answer: style="background:url(images/transparent.png) repeat scroll 0 0 transparent"

透明gif： http://www.golivetutor.com/download/spacer.gif

这篇关于Mouseenter仅在IE9中透明div的边框上触发的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！