Properti MouseEvent clientX

Definisi dan Penggunaan

Ketika peristiwa mouse dijalankan, properti clientX mengembalikan koordinat horisontal penuding pengecek (sesuai dengan area klien).

Area klien adalah jendela saat ini.

Peringatan:Untuk mendapatkan koordinat vertikal penuding pengecek (sesuai dengan area klien), gunakan Properti clientY.

Keterangan:Properti ini hanya dapat di-baca.

Contoh

Contoh 1

Tampilkan koordinat penuding pengecek saat tombol mouse ditekan di atas elemen:

var x = event.clientX;     // Mendapatkan koordinat horisontal
var y = event.clientY;     // Mendapatkan koordinat vertikal
var coor = "X coords: " + x + ", Y coords: " + y;

Coba Sendiri

Contoh 2

Tampilkan koordinat penuding pengecek saat penuding pengecek bergerak di atas elemen:

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

Coba Sendiri

Contoh 3

Perlihatkan perbedaan antara clientX dan clientY serta screenX dan 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;

Coba Sendiri

Sintaks

event.clientX

Detil Teknologi

Nilai kembalian: Nilai angka, menunjukkan koordinat horisontal penuding pengecek, dalam piksel.
Versi DOM: DOM Level 2 Events

Pendukung Peramban

Properti Chrome IE Firefox Safari Opera
clientX Dukungan Dukungan Dukungan Dukungan Dukungan

Halaman yang Berhubungan

Panduan Referensi DOM HTML:Properti clientY MouseEvent

Panduan Referensi DOM HTML:Properti screenX MouseEvent

Panduan Referensi DOM HTML:Properti screenY MouseEvent

Panduan Referensi DOM HTML:Properti offsetX MouseEvent

Panduan Referensi DOM HTML:Properti offsetY MouseEvent