Браузердин терезесиндеги курсордун кыймылына жооп катары айрым иш-аракеттерди программалоо үчүн кээде анын координаттарын аныктоо керек болот. Бул браузерде болуп жаткан окуяларды көзөмөлдөө мүмкүнчүлүгүнө ээ болгон скрипт аркылуу жасалышы мүмкүн. Кардар тараптагы JavaScript скрипти мындай мүмкүнчүлүккө ээ. Төмөндө ушул тилдин мүмкүнчүлүктөрүн колдонуп, курсордун координаттарын алуу варианттарынын бири баяндалган.
Нускамалар
1 кадам
Курсордун учурдагы координаттарын алуу үчүн окуя объектинин касиеттерин колдонуңуз. Бул объект чычкан курсорунун координаттарын аныктоого тиешелүү касиеттердин бүтүндөй жыйындысына ээ. LayerX касиети учурдагы катмардын сол четинен пиксел менен өлчөнгөн аралыкты, ал эми LayerY - анын жогорку четинен ошол эле аралыкты камтыйт. Бул эки касиеттин синонимдери бар - event. LayerX ордуна, event.x, ал эми event. LayerY ордуна, event.y деп жазсаңыз болот. PageX жана pageY касиеттери курсордун горизонталдык жана вертикалдык координаттарын браузердин терезесинин сол жагынын жогору жагына, ал эми screenX жана screenY касиеттери монитордун экранына салыштырмалуу окшош мааниге ээ.
2-кадам
Кодуңузга браузердин түрүн текшерүүнү кошуп, иш-чаранын объектиндеги жогорудагы касиеттерден тышкары, clientX жана clientY касиеттерин колдонуңуз. Бул зарыл, анткени Microsoft өзүнүн Internet Explorer браузеринде башка касиет белгилерин колдонот. Координаттарды аныктоодо эки ыкманы тең бириктире аласыз, мисалы, төмөнкүдөй:
if (evevnt.pageX || evevnt.pageY) {
coordinateX = evevnt.pageX;
ordinY = evevnt.pageY;
}
else if (evevnt.clientX || evevnt.clientY) {
coordinateX = evevnt.clientX + (document.documentElement.scrollLeft || document.body.scrollLeft) - document.documentElement.clientLeft;
coordinateY = evevnt.clientY + (document.documentElement.scrollTop || document.body.scrollTop) - document.documentElement.clientTop;
}
3-кадам
Координаттарды аныктоо кодун колдонуучу функциясына жайгаштырыңыз. Мисалы:
GetMouse функциясы (evevnt) {
var coordinateX = 0, coordinateY = 0;
if (! evevnt) evevnt = window.event;
if (evevnt.pageX || evevnt.pageY) {
coordinateX = evevnt.pageX;
ordinY = evevnt.pageY;
}
else if (evevnt.clientX || evevnt.clientY) {
coordinateX = evevnt.clientX + (document.documentElement.scrollLeft || document.body.scrollLeft) - document.documentElement.clientLeft;
coordinateY = evevnt.clientY + (document.documentElement.scrollTop || document.body.scrollTop) - document.documentElement.clientTop;
}
return {"coordX": coordinateX, "coordY": coordinateY};
}
Бул функция аталган эки элементтен турган массивди кайтарат, алардын биринчиси (coordX баскычы менен) X координатын, экинчиси (coordY) Y координатын камтыйт.
4-кадам
Бул функцияны кандайдыр бир окуяга - мисалы, документтин контекстиндеги чычканды жылдыруу окуясына (onmousemove) чакырыңыз. Төмөндөгү үлгү чычкан координаттарын абал тилкесине чыгаруу үчүн функцияны колдонот:
document.onmousemove = function (evevnt) {var CurCoord = GetMouse (evevnt); window.status = "coord X:" + CurCoord.coordX + "px, Y координаты:" + CurCoord.coordY + "px";};
