Ιδιότητα clientX του MouseEvent

Ορισμός και χρήση

Όταν εκτυπώνεται το συμβάν του ποντικιού, η ιδιότητα clientX επιστρέφει τη γεωμετρική συντεταγμένη του δείκτη του ποντικιού οριζόντια, σύμφωνα με την περιοχή πελάτη.

Η περιοχή πελάτη είναι το τρέχον παράθυρο.

Σημείωση:Για να λάβετε την κάθετη συντεταγμένη του δείκτη του ποντικιού (σύμφωνα με την περιοχή πελάτη), χρησιμοποιήστε clientY Ιδιότητα.

Σημείωση:Η ιδιότητα αυτή είναι αναγνωριστική.

Παράδειγμα

Παράδειγμα 1

Εκτυπώστε τις συντεταγμένες του δείκτη του ποντικιού όταν πατηθεί το κουμπί του ποντικιού στο στοιχείο:

var x = event.clientX;     // Λήψη της οριζόντιας συντεταγμένης
var y = event.clientY;     // Λήψη της κάθετης συντεταγμένης
var coor = "X coords: " + x + ", Y coords: " + y;

Προσπάθησε το ίδιο!

Παράδειγμα 2

Εκτυπώστε τις συντεταγμένες του δείκτη του ποντικιού όταν αυτός κινείται πάνω στο στοιχείο:

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

Προσπάθησε το ίδιο!

Παράδειγμα 3

Δείγμα διαφοράς μεταξύ clientX και clientY και screenX και 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;

Προσπάθησε το ίδιο!

Γλώσσα γραφής

event.clientX

Τεχνικά στοιχεία

Επιστροφή τιμής: Αριθμητική τιμή που εκφράζει τη γεωμετρική συντεταγμένη του δείκτη του ποντικιού οριζόντια, σε pixel.
Έκδοση DOM: DOM Level 2 Events

Υποστήριξη προγράμματος περιήγησης

Χαρακτηριστικά Χρώμημος IE Φαξφερ Σαφάρι Opera
clientX Υποστήριξη Υποστήριξη Υποστήριξη Υποστήριξη Υποστήριξη

Σχετικές Σελίδες

HTML DOM Εγχειρίδιο Εφαρμογής:MouseEvent clientY Ιδιότητα

HTML DOM Εγχειρίδιο Εφαρμογής:MouseEvent screenX Ιδιότητα

HTML DOM Εγχειρίδιο Εφαρμογής:MouseEvent screenY Ιδιότητα

HTML DOM Εγχειρίδιο Εφαρμογής:MouseEvent offsetX Ιδιότητα

HTML DOM Εγχειρίδιο Εφαρμογής:MouseEvent offsetY Ιδιότητα