Benni: Mausposition innerhalb eines Bildes mit Mozilla abfragen

Hallo liebes Forum,

ich möchte auf einem Bild die Mausposition abfragen. Ein Beispiel von SelfHTML:

http://selfhtml.teamone.de/dhtml/modelle/anzeige/domevents.htm

Wenn man über das "Bild" (im Beispiel ein DIV mit Ausgabe "Ein Bereich") fährt, wird die Position ausgebenen. Soweit sogut. Nur will ich die Maus-Position innerhalb des Bildes und nicht die Position relativ zum linken/oberen Rand haben. In dem obigen Beispiel beginnt der linke obere Rand des Bildes bei X=8 und Y=65 und nicht bei X=0 & Y=0.

Wenn ich nun statt Event.clientX z.B. Event.offsetX nehmen könnte, dann wäre das Problem gelöst. Aber das geht wohl nur mit dem IE und nicht mit dem Mozilla (bei mir z.B. 1.4 unter Linux).

Ich habe auch schon Versuche mit (gekürzt)

--- SCHNIPP ---

<script type="text/javascript">
<!--
function Position(Ereignis)
{
alert("x-Wert: " + Ereignis.pageX + " / y-Wert: " + Ereignis.pageY);
}
// document.onmousedown = Position;
}
//-->
</script>

<body>
hallo du da!!! <img src="plot.png" onmousedown="Position()"></img>
</body></html>

--- SCHNAPP ---

gemacht. Er springt beim Anklicken des Bildes auch brav in die Funktion Position rein (kann man z.B. durch alert("foo"); nachvollziehen), aber er scheint Ereignis.pageX dann nicht mehr zu kennen.
Hingegen geht es aber, wenn ich oben das "// document.onmousedown = Position;" statt dem onmouseover bei <img src=[...]> wieder einkommentiere! Dann kennt er auf einmal das pageX wieder...

Wie auch immer - ich komme nicht mehr weiter. Wie kann ich das hinbekommen? Gibt es noch andere, bessere Möglichkeiten? Natürlich wäre es schön, wenn die Lösung dann auch mit dem IE/Opera gehen würde, aber das wird warscheinlich dann eine riesen Fummelei?!

Vielen Dank,
Benni

  1. Hallo Benni,

    suche mit offsetLeft und offsetTop die Koordinaten des linken oberen Ecks des Bildes und zieh das von der Mausposition ab - fertig sind die Mauskoordinaten innerhalb des Bildes.

    Grüße,

    Utz

    --
    Mitglied im Ring Deutscher Mäkler
    1. Zuerst: 1000x sorry für die beiden Doppelpostings! Das war echt keine Absicht!!! Der Reloadbutton im Browser... *schäm*. Ich bin auch nicht blöd (na ja in dem Fall wohl schon...) und auch kein Troll, wie jemand hier meinte. Die FAQ kenne ich und die Antwort hatte ich auch schon gesehen. Danke trotzdem für die Hinweise.

      suche mit offsetLeft und offsetTop die Koordinaten des linken
      oberen Ecks des Bildes und zieh das von der Mausposition ab -
      fertig sind die Mauskoordinaten innerhalb des Bildes.

      Hm - ich fürchte das hilft mir auch nicht weiter. Wenn ich als Beispiel für offsetLeft mal das hier ansehe
      http://selfhtml.teamone.de/javascript/objekte/all.htm#offset_left
      dann geht das im Internet Explorer einwandfrei, im Mozilla hingegen nicht (keine Info Boxen zu sehen). Und genau da ja liegt auch das Ursprungsproblem.

      Gibts denn keine andere Lösung einfach die X- und Y-Mauskoordinate für ein einfaches Bildes zu erfragen, die mit allen Browsern geht?

      Benni

      1. im Mozilla hingegen nicht (keine Info Boxen zu sehen).

        Ich habe das Beispielscript umgeschrieben und so geht es mit dem IE und Mozilla:

        <html><head><title>Test</title>
        </head><body>
        <div id="Bereich" style="padding:20px">
        <p id="Absatz">Hier etwas Text</p>
        </div>
        <script language="JavaScript" type="text/javascript">
        <!--
         alert(document.getElementById("Bereich").offsetLeft);
         alert(document.getElementById("Absatz").offsetLeft);
        //-->
        </script>
        </body></html>

        Regards
           Peter