not able to enter mouse into pop up div
Question
If I hover my mouse into the <div> area, it will move away.
I want the <div> to stay still when a mouse enters the div's region, then the <div> should disappear when I do a mouseout from the <div> , or the <td> .
Why can't my mouse pointer enter the <div> area?
<html>
<div id="divPopup" onmouseout="removeDIV(this,event);" style="display:none;width:100px;height:100px;color:Navy;border:2px;border-color:Red;border-style:solid;">
Yes its me
</div>
<table>
<tr><td>A</td></tr>
<tr><td>S</td></tr>
<tr><td onmouseover="loadDIV(event)" onmouseout="removeDIV(this,event);">D</td></tr>
<tr><td>E</td></tr>
</table>
<script language="javascript" type="text/javascript">
function loadDIV(evt) {
var myWin = document.getElementById('divPopup');
myWin.style.position='absolute';
myWin.style.left = evt.x;
myWin.style.top = evt.y;
myWin.style.display='block';
}
function removeDIV(obj,evt) {
var myWin = document.getElementById('divPopup');
myWin.style.display='none';
myWin.style.left = 0;
myWin.style.top = 0;
}
</script>
</html>
2 answers
solution1
0 2009-08-12 19:19:51
The problem is that onmouseout event fires when you try to enter opened div.
First i suppose you need to timeout removing of div.
And second you need to place a onmouseover event on opened div where you will pause removing of div until mouse will move from the div.
solution2
0 2009-08-12 19:20:55
只需将鼠标也添加到div即可，例如：
<div id="divPopup" onmouseover="loadDIV(event)" onmouseout="removeDIV(this,event);" style="display:none;width:100px;height:100px;color:Navy;border:2px;border-color:Red;border-style:solid;">
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.