MouseEvent clientX Property

Exemple

Délivrer en sortie les coordonnées du pointeur de la souris quand le bouton de la souris est cliqué sur un élément:

var x = event.clientX; // Get the horizontal coordinate
var y = event.clientY; // Get the vertical coordinate
var coor = "X coords: " + x + ", Y coords: " + y;

Pourrait être le résultat de coor:

X coords: 142, Y coords: 99

Essayez vous - même »

Plus "Try it Yourself" - "Try it Yourself" exemples ci - dessous.

Définition et utilisation

La propriété clientX renvoie la coordonnée horizontale (according to the client area) du pointeur de la souris lorsqu'un événement de souris a été déclenchée.

La zone client est la fenêtre en cours.

Astuce: Pour obtenir la coordonnée verticale (selon la zone client) du pointeur de la souris, utilisez la clientY propriété.

Note: Cette propriété est en lecture seule.

Support du navigateur

Propriété
clientX	Oui	Oui	Oui	Oui	Oui

Syntaxe

event .clientX

Détails techniques

Valeur de retour:	Un nombre, qui représente la coordonnée horizontale du pointeur de la souris, en pixels
DOM Version:	DOM niveau 2 Events

autres exemples

Exemple

Délivrer en sortie les coordonnées du pointeur de la souris alors que le pointeur de la souris se déplace sur un élément:

var x = event.clientX;
var y = event.clientY;
var coor = "X coords: " + x + ", Y coords: " + y;
document.getElementById("demo").innerHTML = coor;

Essayez vous - même »

Exemple

Une démonstration des différences entre clientX et clientY et screenX et screenY:

var cX = event.clientX;
var sX = event.screenX;
var cY = event.clientY;
var sY = event.screenY;
var coords1 = "client - X: " + cX + ", Y coords: " + cY;
var coords2 = "screen - X: " + sX + ", Y coords: " + sY;

Essayez vous - même »