A mouseover,mouseout is used to trigger an event to determine whether the mouse is in the area. But the limitation of this approach is that you have to trigger mouseover, or Mouseout,mouseleave events to know
Today studied this question, also popularized the knowledge.
Method One:
A mouseover,mouseout is used to trigger an event to determine whether the mouse is in the area. But the limitation of this approach is that you have to trigger mouseover, or Mouseout,mouseleave events to know.
The code is as follows:
function Chkin ()
{
Div_1.innertext = "Now you move the mouse into the layer!" ";
Div_1.style.font = "normal Black";
}
function Chkout ()
{
Div_1.innertext = "Now you move the mouse out of the layer!" ";
Div_1.style.font = "Bold Red";
}
The code is as follows:
<div id= "div_1" style= "background-color:lightblue; width:400px; height:300px; "
Onmouseover= "Chkin ()" onmouseout= "Chkout ()" >this is a DIV
</div>
Method Two:
The code is as follows:
function CheckIn (e) {
var x=window.event.clientx;
var y= Window.event.clientY;
var str= ';
for (I=0;i <document.body.children.length;i++) {
var Obj=document.body.children[i];
if (x> obj.offsetleft
&&x < (obj.offsetleft+ Obj.clientwidth)
&&y> obj.offsettop
&&y < (obj.offsettop+obj.clientheight)) {
str+= ' < Mouse is located within the layer ' +obj.id+ ' range > n ';
}else{
str+= ' < mouse is outside the layer ' +obj.id+ ' range > n ';
}
}
Alert (str);
}
Document.onclick=checkin
Method Three:
This method is the simplest and practical.
The code is as follows:
if (Mydiv.contains (window.event.srcElement))
That is, if (Mydiv.contains (element object of the mouse position))
The specific situation or according to their own needs to choose, I was debugging a way to three, but the specific also did not use. Other methods to continue the study.