Use javascript to obtain the cursor position on the page and the object that triggers the event. use javascript to obtain the cursor position:
The Code is as follows:
Function mousePosition (ev ){
If (ev. pageX | ev. pageY ){
Return {
X: ev. pageX,
Y: ev. pageY
};
}
Return {
X: ev. clientX + document. body. scrollLeft-document. body. clientLeft,
Y: ev. clientY + document. body. scrollTop-document. body. clientTop
};
}
Document. onmousemove = mouseMove;
Function mouseMove (ev ){
Ev = ev | window. event;
Var mousePos = mousePosition (ev );
}
For a detailed description of the Code, the original article has already been introduced and is now transferred here:
First, we need to declare an evnet object. An evnet object will be activated no matter whether it is moved, clicked, or pressed. in Internet Explorer, event is a global variable and will be stored in window. event. in firefox or other browsers, events are obtained by corresponding functions. when we assign the mouseMove function to document. onmousemove, mouseMove will get the mouse movement event.
To allow ev to obtain event Events in all browsers, "| window. event" in Firefox does not work because ev has a value assignment. Ev is empty in MSIE, so the window. event is obtained.
Because we need to obtain the mouse position multiple times in this article, we have designed a mousePosition function, which contains a parameter: event.
Because we want to run in MSIE and other browsers, Firefox and other browsers use event. pageX and event. pageY indicates the position of the mouse relative to the document. If you have a 500*500 window and your mouse is in the absolute middle, the pageX and pageY values are both 250, if you scroll down 500, pageY will become 750.
The opposite is true for MSIE. It uses event. clientX and event. clientY to indicate the location where the mouse is equivalent to the window, rather than the document. In the same example, If you scroll down to 500, clientY is still 250. Therefore, we need to add the attributes of scrollLeft and scrollTop relative to the document. Finally, the document in MSIE does not start from 0 to 0, but usually has a small border (usually 2 pixels). The border size is defined in document. body. in clientLeft and clientTop, we also add these.
Fortunately, we have used the mousePosition function to solve the coordinate problem, so we don't have to worry about it.
Use javascript to obtain the object that triggers the event
The Code is as follows:
