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-ը պարունակում են իրադարձության կոորդինատները ոլորումը հաշվի առնելով:

Շարահյուսություն

javascriptevent.pageY;

Օրինակ

Էջի վրա մկնիկի շարժման ընթացքում մենք կցուցադրենք նրա կոորդինատները դիտարկիչի պատուհանի նկատմամբ (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;
});

Результат:

Տես նաև

  • clientY հատկությունը,
    որը որոշում է մկնիկի կոորդինատները Y առանցքի վրա
  • clientX հատկությունը,
    որը որոշում է մկնիկի կոորդինատները X առանցքի վրա
  • pageX հատկությունը,
    որը որոշում է մկնիկի կոորդինատները X առանցքի վրա