Wie finde ich die Mausposition?
Um die Mausposition mit Javascript zu ermitteln, kann man folgende Funktion verwenden.
javascript
function mouse_pos(e) { |
if(!e) e = window.event; |
var body = (window.document.compatMode && window.document.compatMode == "CSS1Compat") ? |
window.document.documentElement : window.document.body; |
return { |
// Position im Dokument |
top: e.pageY ? e.pageY : e.clientY + body.scrollTop - body.clientTop, |
left: e.pageX ? e.pageX : e.clientX + body.scrollLeft - body.clientLeft |
}; |
} |
Rückgabe:
.top / .left - Position im Dokument
Beispiel
Javascript
Das Skript dazu sieht so aus:
javascript
var on = false; |
function Start(e){ |
if(on) { |
window.document.onmousemove = null; |
e.value ='Start'; |
}else { |
window.document.onmousemove = showMousePos; |
e.value ='Stopp'; |
} |
on = !on; |
} |
function showMousePos(e){ |
var p = mouse_pos(e); |
for(var i in p) { |
document.forms['maus_pos'].elements[i].value = p[i]; |
} |
} |
HTML
und der HTML Code dazu (nur das Formular):
html
<form action="#" name="maus_pos"> |
<input type="text" name="top" size="3"> |
<input type="text" name="left" size="3"> |
<input type="text" name="scrollTop" size="3"> |
<input type="text" name="scrollLeft" size="3"> |
<input type="button" value="Start" onclick="Start(this);"> |
</form> |
Comments (7)
11453 mal gelesen.
11453 mal gelesen.
7 Kommentare Einen Kommentar hinterlassen »
Kommentare
Sonntag 23.März 2008: 2:47
Hallo für mich ist nicht einsehbar wofür man die Mausposition braucht. Ist das um in einem eingebetten Bild oder an einer Textstelle die nötige Pixelzahl von oben und von der Seite zu erhalten, um dort einen tooltipp oder onmouse Befehl zu positionieren? Mhm, wäre schön eine Antwort zu erhalten. Mfg, Johannes T.
Samstag 5.April 2008: 9:50
Genau das hab ich gesucht!!!!!!! Danke!!
Da ich zwar im Mozilla über pageX usw. Die relative Pos. der Mouse vom Doc bestimmen konnte das aber nicht mit dem IE funktioniert hat. Aber mit dem script klappt es.
Also weiter so super sache
Mittwoch 20.August 2008: 2:15
Im Gegensatz zu Johannes wüsste ich ein paar Beispiele, wofür man die Mausposition braucht...
Aber egal. Was mir aufgefallen ist, dass im MS IE die Mausposition nicht mit der Position im Dokument übereinstimmt!? Irgendwie ist sie 2 Pixel daneben. Versuch doch mal, die linke-oberste weiße Ecke im Dokument anzuklicken. Kann man das irgendwie sinnvoll abfangen?
evt.pageX und Y liefern bei den anderen Browsern vernünftige Werte.
Gruss
H.
Donnerstag 12.März 2009: 10:18
nettes script, leider ist der code oben falsch, was im IE zu problemen führt !
im return darf hinter "body.clientLeft" KEIN Komma stehen.
return {
// Position im Dokument
top: e.pageY ? e.pageY : e.clientY + body.scrollTop - body.clientTop,
left: e.pageX ? e.pageX : e.clientX + body.scrollLeft - body.clientLeft,
};
Donnerstag 12.März 2009: 13:12
Nur im IE, aber du hast natürlich vom Prinzip her recht. Ich hab's geändert, Danke.
Montag 12.Oktober 2009: 19:34
Super, vielen dank^^
Ich brauche die Position des Mauszeigers z.B. für mein neues Browsergame, an dem ich gerade Programmiere.
@Johannes
Du fragst für was man die Mauszeigerposition brauchen könnte? Das meinst du doch nicht ernst? Für was braucht man Formulare? Für was eine ermittlung welche Taste man drückt? Um mit dem Benutzer der seite Interagieren zu können natürlich!!! Aber wenn der kein Hirn hat wie in deinem Fall, dann braucht man die Position natürlich nicht, den dann ist klar das du nichts damit anfangen kannst.
Gruss
Stefan
Mittwoch 28.Juli 2010: 13:05
Auch danke von mir.
@Johannes: Ein paar Anwendungsbeispiele: Drag'n'Drop, Fenster zeiehen, wie bei Windows aufm Desktop, ...
Einen Kommentar hinterlassen