Comment obtenir la position de la souris sans événements (sans déplacer la souris) ?

Question

Est-il possible d'obtenir la position de la souris avec JavaScript après le chargement de la page sans événement de mouvement de la souris (sans déplacer la souris) ?

Answer 1

Vous pourriez essayer quelque chose de similaire à ce que Tim Down a suggéré - mais au lieu d'avoir des éléments pour chaque pixel de l'écran, créez seulement 2-4 éléments (boîtes), et changez leur emplacement, largeur, hauteur dynamiquement pour diviser les emplacements encore possibles sur l'écran par 2-4 récursivement, trouvant ainsi l'emplacement réel de la souris rapidement.

Par exemple, les premiers éléments occupent les moitiés droite et gauche de l'écran, puis les moitiés supérieure et inférieure. A présent, nous savons déjà dans quel quart de l'écran se trouve la souris, nous pouvons répéter - découvrir quel quart de cet espace...

Answer 2

La solution la plus simple mais pas 100% précise

$(':hover').last().offset()

Résultat : {top: 148, left: 62.5}
Le résultat dépend de la taille de l'élément le plus proche et retourne undefined lorsque l'utilisateur change d'onglet

Answer 3

Voici ma solution. Elle exporte window.currentMouseX y window.currentMouseY des propriétés que vous pouvez utiliser partout. Il utilise initialement la position d'un élément survolé (le cas échéant) et écoute ensuite les mouvements de la souris pour définir les valeurs correctes.

(function () {
    window.currentMouseX = 0;
    window.currentMouseY = 0;

    // Guess the initial mouse position approximately if possible:
    var hoveredElement = document.querySelectorAll(':hover');
    hoveredElement = hoveredElement[hoveredElement.length - 1]; // Get the most specific hovered element

    if (hoveredElement != null) {
        var rect = hoveredElement.getBoundingClientRect();
        // Set the values from hovered element's position
        window.currentMouseX = window.scrollX + rect.x;
        window.currentMouseY = window.scrollY + rect.y;
    }

    // Listen for mouse movements to set the correct values
    window.addEventListener('mousemove', function (e) {
        window.currentMouseX = e.pageX;
        window.currentMouseY = e.pageY;
    }, /*useCapture=*/true);
}())

Composr CMS Source : https://github.com/ocproducts/composr/commit/a851c19f925be20bc16bfe016be42924989f262e#diff-b162dc9c35a97618a96748639ff41251R1202

Answer 4

J'ai implémenté une recherche horizontale/verticale, (d'abord faire une div pleine de liens de ligne verticale disposés horizontalement, puis faire une div pleine de liens de ligne horizontale disposés verticalement, et simplement voir lequel a l'état de survol) comme l'idée de Tim Down ci-dessus, et cela fonctionne assez rapidement. Malheureusement, cela ne fonctionne pas sur Chrome 32 sous KDE.

jsfiddle.net/5XzeE/4/

Answer 5

Vous ne devez pas déplacer la souris pour obtenir l'emplacement du curseur. L'emplacement est également signalé sur les événements autres que mousemove . Voici un clic-événement à titre d'exemple :

document.body.addEventListener('click',function(e)
{
    console.log("cursor-location: " + e.clientX + ',' + e.clientY);
});