آموزش طراحی سایت (HTML CSS Javascript) | آتریا

رویداد clientY

مثال (رویداد clientY)

برگرداندن مختصات اشاره گر موس در خروجی، هنگامی که بر روی یک عنصر کلیک می شود:

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

خروجی coor در کد بالا:

X coords: 142, Y coords: 99

خودتان امتحان کنید »

در انتهای این صفحه، مثال های بیشتری آورده شده است.

تعریف و کاربرد

خصوصیت clientY، هنگام اجرای یک رویداد موس(نسبت به پنجره کنونی)، مختصات عموی موس(y) را برمی گرداند.

نکته: برای گرفتن مختصات افقی اشاره گر موس، از خصوصیت clientX استفاده کنید.

نکته: تین خصوصیت "فقط خواندنی" است.

پشتیبانی مرورگرها

متد
clientY	بله	بله	بله	بله	بله

نحوه استفاده

event.clientY

جزئیات تکنیکی

مقدار برگشتی	یک عدد که مختصات عمودی موس را به پیکسل برمی گرداند
DOM Version:	DOM Level 2 Events

مثال - خودتان امتحان کنید

مثال (رویداد clientY)

برگرداندن مختصات موس هنگامی که اشاره گر موس بر روی یک عنصر حرکت می کند:

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

خودتان امتحان کنید »

مثال (رویداد clientY)

یک نسخه نمایشی برای مشخص کردن اختلاف بین 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;

خودتان امتحان کنید »

آموزش های مرتبط

مرجع مدل DOM در اچ تی ام ال MouseEvent clientX Property

مرجع مدل DOM در اچ تی ام ال MouseEvent screenX Property

مرجع مدل DOM در اچ تی ام ال MouseEvent screenY Property

مرجع کلیه رویدادهای JavaScript

: نوشته شده توسط احسان عباسی; بازدید: 6106

برای درج دیدگاه، ابتدا باید وارد بیاموز شوید.

تمامی محصولات و خدمات این وبسایت، حسب مورد دارای مجوزهای لازم از مراجع مربوطه می‌باشند و فعالیت‌های این سایت تابع قوانین و مقررات جمهوری اسلامی ایران است.

مجوز نشر دیجیتال از وزرات فرهنگ و ارشاد اسلامی