Zjištění souřadnic myši
Jak v JavaScriptu zjistit aktuální souřadnice myši (kursoru).
V některých situací (jako třeba u efektu baterky nebo kontextové nabídky) je třeba skriptem sledovat, kde je umístěn kursor. Universální JS funkce sjednocující chování napříč prohlížeči (hlavně IE a ostatní prohlížeče) může vypadat takto:
function getPosition(e) {
e = e || window.event;
var cursor = {x:0, y:0};
if (e.pageX || e.pageY) {
cursor.x = e.pageX;
cursor.y = e.pageY;
}
else {
cursor.x = e.clientX +
(document.documentElement.scrollLeft ||
document.body.scrollLeft) -
document.documentElement.clientLeft;
cursor.y = e.clientY +
(document.documentElement.scrollTop ||
document.body.scrollTop) -
document.documentElement.clientTop;
}
return cursor;
}
Použití je potom následovné:
var souradnice = getPosition(e);
- V
souradnice.x
bude X-ová souřadnice (nebo takéleft
hodnota). - V
souradnice.y
bude Y-ová souřadnice (nebo takétop
hodnota).
Při nastavování CSS se nesmí zapomenout na přidání jednotky px
.
neco.style.left = souradnice.x + "px";
neco.style.top = souradnice.y + "px";
Při používání funkce je nutné předávat event
.
<script>
function funkce(e) {
var souradnice = getPosition(e);
}
</script>
<p onclick='funkce(event)'>
Komentáře