"curPos" est un plugin JavaScript qui permet de récupérer les coordonnées en pixels du curseur, relatives à la fenêtre du navigateur et / ou à la zone d'affichage (viewport).
Il ajoute à l'objet "window" un objet nommé "curPos" avec les 4 propriétés suivantes :
- "clientX" : coordonnée horizontale en pixels du curseur en fonction de la fenêtre
- "clientY" : coordonnée verticale en pixels du curseur en fonction de la fenêtre
- "viewportX" : coordonnée horizontale en pixels du curseur en fonction de la zone d'affichage
- "viewportY" : coordonnée verticale en pixels du curseur en fonction de la zone d'affichage
(function(c, u, r, p, o, s) {
u = c[u] = {};
u[r] = 0;
u[p] = 0;
u[o] = 0;
u[s] = 0;
document.addEventListener('mousemove', function(e) {
u[o] = e[r];
u[s] = e[p];
u[r] = e[r] + c.scrollX;
u[p] = e[p] + c.scrollY;
});
c.addEventListener('scroll', function() {
u[s] = u[o] + c.scrollX;
u[p] = u[r] + c.scrollY;
});
})(window, 'curPos', 'clientX', 'clientY', 'viewportX', 'viewportY');Voici un exemple de récupération des coordonnées du curseur au clic dans la page :
document.addEventListener('click', function(e) {
console.log({
"Coordonnée horizontale dans la fenêtre": curPos.clientX,
"Coordonnée verticale dans la fenêtre": curPos.clientY,
"Coordonnée horizontale dans le document": curPos.viewportX,
"Coordonnée verticale dans le document": curPos.viewportY
});
});Cet article vous a-t-il été utile ?
Super :)
Merci d'avoir donné votre avis !
Oups :(
Merci d'avoir donné votre avis qui va nous permettre de nous améliorer !