event.pageX Property

event.pageX property သည် X-axis ပေါ်ရှိ မောက်စ်ကားဆာ၏ ကိုဩဒိနိတ်များကို ပါဝင်သည်။ ကိုဩဒိနိတ်များကို သတ်မှတ်ရန်အတွက် event.clientX, event.clientY, event.pageY properties များလည်း ရှိပါသည်။ clientX/clientY နှင့် pageX/pageY တို့ကြားကွာခြားချက်ကို ကြည့်ရှုကြပါစို့။

clientX နှင့် clientY တို့အလုပ်လုပ်ပုံမှာ- သင့်တွင် 1000 x 1000 pixels ရှိသော ၀င်းဒိုးတစ်ခုရှိပြီး မောက်စ်သည် အလယ်ဗဟိုတွင်ရှိလျှင်၊ clientX နှင့် clientY နှစ်ခုလုံးသည် 500 နှင့် ညီမျှပါမည်။ အကယ်၍ သင့်အနေဖြင့် ကားဆာကို မရွှေ့ဘဲ စာမျက်နှာကို အလျားလိုက် သို့မဟုတ် ဒေါင်လိုက် စခရိုလ်လုပ်ပါက၊ clientX နှင့် clientY တန်ဖိုးများ မပြောင်းလဲပါ၊ အဘယ့်ကြောင့်ဆိုသော် ၎င်းတို့ကို စာရွက်စာတမ်းနှင့် ဆက်စပ်မှုမဟုတ်ဘဲ ၀င်းဒိုးနှင့် ဆက်စပ်၍ တွက်ချက်ထားသောကြောင့်ဖြစ်သည်။

pageX နှင့် pageY တို့အလုပ်လုပ်ပုံမှာ- သင့်တွင် 1000 x 1000 pixels ရှိသော ၀င်းဒိုးတစ်ခုရှိပြီး ကားဆာသည် အလယ်ဗဟိုတွင်ရှိလျှင် pageX နှင့် pageY နှစ်ခုလုံးသည် 500 နှင့် ညီမျှပါမည်။ အကယ်၍ သင့်အနေဖြင့် စာမျက်နှာကို အောက်ဘက်သို့ 250 pixels စခရိုလ်လုပ်ပါက၊ pageY သည် 750 နှင့် ညီမျှလာပါမည်။ ထို့ကြောင့် pageX နှင့် pageY တို့တွင် စခရိုလ်ခြင်းကို ထည့်သွင်းစဉ်းစားထားသော ဖြစ်ရပ်၏ ကိုဩဒိနိတ်များ ပါဝင်ပါသည်။

Syntax

javascriptevent.pageX;

ဥပမာ

စာမျက်နှာပေါ်တွင် မောက်စ်ရွှေ့လျားနေစဉ် ၀င်းဒိုး browser ၏ ဆက်စပ်မှုဖြင့် ၎င်း၏ကိုဩဒိနိတ်များကို ထုတ်ပြမည် (pageX နှင့် pageY):

html<div id="elem">0 : 0</div>

javascriptlet elem = document.getElementById('elem');

document.addEventListener('mousemove', function(event) {
  elem.innerHTML = event.pageX + ' : ' + event.pageY;
});

Результат:

ဆက်လက်ဖတ်ရှုရန်