onMouseOut часто срабатывает при перемещении внутри тега привязки - PullRequest
0 голосов
/ 18 августа 2011

У меня есть тег привязки, который имеет событие 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";
...
}

Ответы [ 2 ]

1 голос
/ 18 августа 2011

onmouseover срабатывает каждый раз, когда вводится мышь ИЛИ перемещается над перебираемым предметом.Возможно, вы захотите onmouseenter показать всплывающую подсказку.Это срабатывает только тогда, когда мышь пересекает границы элемента внутрь.

0 голосов
/ 20 августа 2011

Немного сумасшедший, но проблема в том, что когда всплывающая подсказка появилась, она перекрывалась с текстом, который вызвал событие. По какой-то причине это вызвало быстрое срабатывание обеих функций. Я исправил проблему, переместив всплывающую подсказку от текста.

...