X- und Y-Koordinaten bei Klick auf Bild ermitteln

[Knusperklumpen]

Hi,
ich habe ein Bild was inmitten einer Tabelle liegt und möchte nun bei Klick auf dieses Bild die Koordinaten ermitteln wo ich auf das Bild geklickt habe. Ich meine damit nicht die Koordinaten der Maus sondern die des Bildes.
Bei <input type="image" ...> funktioniert das ja, bzw. dem Formular werden die Koordinaten beim Abschicken angehangen. Ich möchte meine Seite allerdings nicht abschicken.
Ich habe schon probiert über die Mauskoordinaten zu arbeiten und dann halt durch wilde Rechnerei die Koordinaten des Bildes rauszubekommen, das klappt aber nicht, weil das Bild ja mitten in einer Tabelle ist, bzw. dort auch noch dynamisch mittels appendChild an verschiedenen Stellen angezeigt wird.

Daher meine Frage ob man die X- und Y-Koordinaten, die beim Abschicken eines Formulars ermittelt werden auch ohne Abschicken bekommen kann ?

Falls das nicht geht hat ja vielleicht jemand ne Idee, wie ich an top und left eines Bildes rankomme, was mitten in einer Tabelle steckt.

Danke und mfg
Knusperklumpen

[fastix®]

Moin!

Daher meine Frage ob man die X- und Y-Koordinaten, die beim Abschicken eines Formulars ermittelt werden auch ohne Abschicken bekommen kann ?

Es werden immer nur die Formularinhalte übermittelt, nie das absendende Formular selbst. In einem Formular, welches nur ein <input type='image' name='image' src ...> enthält eben die Koordinaten der Klickstelle.

MFFG (Mit freundlich- friedfertigem Grinsen)

fastix®

[Knusperklumpen]

Es werden immer nur die Formularinhalte übermittelt, nie das absendende Formular selbst. In einem Formular, welches nur ein <input type='image' name='image' src ...> enthält eben die Koordinaten der Klickstelle.

Schön, beantwortet zwar nicht die Frage aber ich formulier sie einfach mal um.

Daher meine Frage ob man die X- und Y-Koordinaten, die beim Abschicken der Formularinhalte eines Formulars ermittelt werden auch ohne Abschicken bekommen kann ?

;-)

[fastix®]

Moin!

Daher meine Frage ob man die X- und Y-Koordinaten, die beim Abschicken der Formularinhalte eines Formulars ermittelt werden auch ohne Abschicken bekommen kann ?

Du willst also gar kein submit durchühren?, dann willst Du die Werte in Javascript weiterverarbeiten?

<script type='text/javascript'>

function tolleFunktion() {

var X= document.forms['mouseover'].elements['image'].x.falue;
  var Y= document.forms['mouseover'].elements['image'].y.falue;
  // (ungetestet...)

alert(X+":"+Y)

return false;
  // Formular wird nicht abgesendet.
}

<script>

<form onsubmit='tolleFunktion()' name='mouseover'>
<input type='image' style='width:200px: height:200px;' src='image.gif' name='image'
</form>

Sollte es das nicht sein, formuliere Deine Frage klarer.

MFFG (Mit freundlich- friedfertigem Grinsen)

fastix®

[wahsaga]

hi,

var X= document.forms['mouseover'].elements['image'].x.falue;

^^^^^

value oder failure?

gruß,
wahsaga

[fastix®]

Moin!

value oder failure?

Beides. :)

MFFG (Mit freundlich- friedfertigem Grinsen)

fastix®

[molily]

var X= document.forms['mouseover'].elements['image'].x.falue;
  // (ungetestet...)

Urgs. Bitte keine aus der Luft gegriffenen Spekulationen posten.
Weder tauchen input-Elemente vom Typ image in der elements-Collection auf, noch haben sie eine Eigenschaft x bzw. y, die somit auch kein Unterobjekt »value« haben.

Mathias

[MudGuard]

Hi,

Weder tauchen input-Elemente vom Typ image in der elements-Collection auf,

Weißt Du zufällig, mit welcher Begründung <input type="image"> da fehlt?
<input type="submit"> taucht ja auch auf.
Nur weil <input type="image"> für die Anzeige u.U. ein Bildchen hat, kann ja wohl kaum der Grund sein ...

cu,
Andreas

[molily]

Weder tauchen input-Elemente vom Typ image in der elements-Collection auf,

Weißt Du zufällig, mit welcher Begründung <input type="image"> da fehlt?

Nein, das ist mir rätselhaft.

[MudGuard]

Hi,

Weißt Du zufällig, mit welcher Begründung <input type="image"> da fehlt?
Nein, das ist mir rätselhaft.

Willkommen im Club. ;-)

cu,
Andreas

[MudGuard]

Hi,

Bei <input type="image" ...> funktioniert das ja, bzw. dem Formular werden die Koordinaten beim Abschicken angehangen. Ich möchte meine Seite allerdings nicht abschicken.

Im onclick-Eventhandler solltest Du doch an die Mauskoordinaten des Klicks rankommen ...

cu,
Andreas

[molily]

Hallo,

Daher meine Frage ob man die X- und Y-Koordinaten, die beim Abschicken eines Formulars ermittelt werden auch ohne Abschicken bekommen kann ?

offsetX/Y für MSIE, Opera, Konqueror und Safari, laxerX/Y für Gecko. Das Bild muss dazu mindestens position:relative haben oder direkt (ohne Abstände nach links und oben) in einem Blockelement mit position:relative oder position:absolute liegen.

Mathias

[Knusperklumpen]

Hi und Danke, das funktioniert wunderbar !!
Ich hatte diese Sachen zwar auch schon gefunden aber dein Tipp mit position:relative hat die entscheidende Verbesserung gebracht !

Danke
Knusperklumpen

[molily]

Ich hatte diese Sachen zwar auch schon gefunden aber dein Tipp mit position:relative hat die entscheidende Verbesserung gebracht !

Ja, das liegt an der schlechten Erklärung in SELFHTML. In der nächsten Version wird das eindeutiger beschrieben sein. (Und es gibt ein Beispiel zu layerX/Y, bei dem genau das demonstriert wird, was du gefragt hast. Das jetzige Beispiel mit onresize zeigt eine vergleichsweise irrelevante Anwendung von layerX/Y.)

Mathias