La position du curseur souris est signalé sur l' event objet reçu par un gestionnaire pour l' mousemove événement, que vous pouvez attacher à la fenêtre (l'événement bulles):
(function() {
document.onmousemove = handleMouseMove;
function handleMouseMove(event) {
var dot, eventDoc, doc, body, pageX, pageY;
event = event || window.event; // IE-ism
// If pageX/Y aren't available and clientX/Y are,
// calculate pageX/Y - logic taken from jQuery.
// (This is to support old IE)
if (event.pageX == null && event.clientX != null) {
eventDoc = (event.target && event.target.ownerDocument) || document;
doc = eventDoc.documentElement;
body = eventDoc.body;
event.pageX = event.clientX +
(doc && doc.scrollLeft || body && body.scrollLeft || 0) -
(doc && doc.clientLeft || body && body.clientLeft || 0);
event.pageY = event.clientY +
(doc && doc.scrollTop || body && body.scrollTop || 0) -
(doc && doc.clientTop || body && body.clientTop || 0 );
}
// Use event.pageX / event.pageY here
}
})();
(À noter que le corps de l' if ne fonctionnera que sur les vieux IE.)
Exemple de la ci-dessus en action - il attire les points que vous faites glisser votre souris sur la page. (Testé sur IE8, IE11, Firefox 30, Chrome 38.)
Si vous avez vraiment besoin d'une minuterie à base de solution, vous combinez cela avec certaines variables d'état:
(function() {
var mousePos;
document.onmousemove = handleMouseMove;
setInterval(getMousePosition, 100); // setInterval repeats every X ms
function handleMouseMove(event) {
var dot, eventDoc, doc, body, pageX, pageY;
event = event || window.event; // IE-ism
// If pageX/Y aren't available and clientX/Y are,
// calculate pageX/Y - logic taken from jQuery.
// (This is to support old IE)
if (event.pageX == null && event.clientX != null) {
eventDoc = (event.target && event.target.ownerDocument) || document;
doc = eventDoc.documentElement;
body = eventDoc.body;
event.pageX = event.clientX +
(doc && doc.scrollLeft || body && body.scrollLeft || 0) -
(doc && doc.clientLeft || body && body.clientLeft || 0);
event.pageY = event.clientY +
(doc && doc.scrollTop || body && body.scrollTop || 0) -
(doc && doc.clientTop || body && body.clientTop || 0 );
}
mousePos = {
x: event.pageX,
y: event.pageY
};
}
function getMousePosition() {
var pos = mousePos;
if (!pos) {
// We haven't seen any movement yet
}
else {
// Use pos.x and pos.y
}
}
})();
Autant que je sache, vous ne pouvez pas obtenir la position de la souris sans avoir vu un événement, quelque chose qui cette réponse à un autre Débordement de Pile question semble le confirmer.
Remarque: Si vous allez faire quelque chose tous les 100 ms (10 fois/seconde), essayez de garder le traitement réel-vous dans cette fonction très, très limité. C'est beaucoup de travail pour le navigateur, en particulier les plus âgés de Microsoft. Oui, sur les ordinateurs modernes, il ne semble pas comme beaucoup, mais il se passe beaucoup de choses dans les navigateurs... Si par exemple, vous pouvez garder une trace de la dernière position de traitement et de caution à partir du gestionnaire immédiatement si la position n'a pas changé.
