Question

将鼠标悬停在标签上时，我希望图像显示并显示在屏幕的最前端。当我离开它时，我希望它消失。我的问题是，当我将鼠标移动到标签上时，图像消失并再次出现。鼠标关闭事件不应该使项目消失，只有当我完全脱离标签时才会发生吗？我怎样才能做到这一点？

labelArray[1].onmouseover = function() {
    if (BBVar != 1)
        mouseOverOption('BB1' + group);
};
labelArray[1].onmouseout = function() {
    if ((clicked == false) && (BBVar != 1))
        mouseOffOption('BB1' + group);
};

function mouseOverOption(a) {
    document.getElementById(a).style.visibility = 'visible';
    document.getElementById(a).style.zIndex="5";
}

function mouseOffOption(a) {
    document.getElementById(a).style.visibility = 'hidden';
    document.getElementById(a).style.zIndex="0";
}

Answer 1

即使将光标从目标元素移动到其中一个子元素，

mouseout也会触发。替代方案是mouseleave事件，遗憾的是它仅在IE中受支持。在这里阅读更多http://www.quirksmode.org/dom/events/mouseover.html

如果您可以使用jQuery，它可以对mouseleave：

进行跨浏览器支持

$(labelArray[1]).on('mouseleave', function() {
    if ((clicked == false) && (BBVar != 1))
        mouseOffOption('BB1' + group);
});

在纯JS中，您必须检查event.relatedTarget属性以查看鼠标的位置。如果没有看到你的标记，很难给出一个确切的解决方案。

onmouseout事件发生在我仍然悬停在标签上时

1 个答案: