თვისება event.pageY
თვისება event.pageY შეიცავს
მაუსის კურსორის კოორდინატებს Y ღერძზე.
კოორდინატების დასადგენად ასევე არსებობს თვისებები
event.clientX,
event.clientY,
event.pageX.
მოდით ვნახოთ განსხვავება clientX/clientY
და pageX/pageY შორის.
როგორ მუშაობენ clientX და clientY:
თუ თქვენ გაქვთ ფანჯარა 1000 ზე 1000
პიქსელი, და მაუსი მდებარეობს ცენტრში, მაშინ clientX
და clientY ორივე იქნება 500-ის ტოლი. თუ
თქვენ შემდეგ გადახვევთ გვერდს ჰორიზონტალურად
ან ვერტიკალურად, კურსორის გადაადგილების გარეშე, მაშინ მნიშვნელობები
clientX და clientY არ შეიცვლება, რადგან ისინი ითვლება
ფანჯარასთან მიმართებაში, და არა დოკუმენტთან.
როგორ მუშაობენ pageX და pageY:
თუ თქვენ გაქვთ ფანჯარა 1000 ზე 1000
პიქსელი, და კურსორი მდებარეობს ცენტრში, მაშინ
pageX და pageY იქნება 500-ის ტოლი. თუ
თქვენ შემდეგ გადახვევთ გვერდს 250
პიქსელით ქვემოთ, მაშინ pageY გახდება 750-ის ტოლი.
ამგვარად pageX და pageY შეიცავს მოვლენის კოორდინატებს
გათვალისწინებული სკროლინგი.
სინტაქსი
event.pageY;
მაგალითი
მაუსის გვერდზე გადაადგილებისას ჩვენ გამოვიტანთ
მის კოორდინატებს ბრაუზერის ფანჯარასთან მიმართებაში
(pageX და pageY):
<div id="elem">0 : 0</div>
let elem = document.getElementById('elem');
document.addEventListener('mousemove', function(event) {
elem.innerHTML = event.pageX + ' : ' + event.pageY;
});
:
