0

我有一个锚标记，它同时具有 onMouseOver 和 onMouseOut 事件。目的是显示工具提示。当我将鼠标悬停在锚标记上时，会适当地触发 onMouseOver 事件并显示工具提示，但也会触发 onMouseOut 事件并隐藏工具提示。当我将鼠标移到锚链接上时，这两个事件都非常频繁地触发，基本上使工具提示闪烁可见和不可见。我希望 onMouseOut 仅在我超出锚标记边界时触发。

我认为相关的代码：

HTML：

<ul>
<li>
<a id="1" href="event.php?1" onmouseover="tooltip(this.offsetWidth, this.offsetHeight, this.childNodes, 1)" onmouseout="tooltipHide(1)">Text</a>
<div class="tt">
<div id="tt2" class="tooltip">
...
</div>
</div>
</li>

<li>
<a id="2" href="event.php?2" onmouseover="tooltip(this.offsetWidth, this.offsetHeight, this.childNodes, 2)" onmouseout="tooltipHide(2)">Text</a>
<div class="tt">
<div id="tt2" class="tooltip">
...
</div>
</div>
</li>
</ul>

Javascript：

function tooltipHide(id) {
tt = document.getElementById("tt"+id);
tt.style.display = "none";
}

function tooltip(oW, oH, e, id) {
...
tt = document.getElementById("tt"+id);
tt.style.display = "block";
...
}
4

2 回答 2

1

每当鼠标进入或移过被覆盖的项目时都会触发 onmouseover。onmouseenter相反，您可能希望显示工具提示。只有当鼠标越过元素的边界进入内部时才会触发。

于 2011-08-18T18:13:22.080 回答
0

有点疯狂，但问题是当工具提示出现时，它与触发事件的文本重叠。出于某种原因，这导致两个函数快速来回触发。我通过将工具提示从文本中移开来解决了这个问题。

于 2011-08-19T20:56:56.753 回答