Mausposition bei onmouseover unter Mozilla/Eventüberwachung

[Elya]

Hallo,
nach längerer Zeit muß ich mich mal wieder in ein fremdes Javascript reinfummeln und hänge gerade ziemlich fest...

Aufgabe: An Punkten in einer Imagemap bei Mouseover einen je nach id gefüllten Layer einblenden.

Das Füllen klappt mit innerHTML ganz sauber, in IE und Mozilla, auch das Ein- und Ausblenden natürlich.

Mein Problem ist, daß ich die Mausposition via Eventüberwachung (captureEvents) nicht mit einem punktuellen Eventhandler kombiniert bekomme, und mir fällt nichts ein, wie ich sonst auf "onmouseover" meine Mausposition bekomme.

Ein kleines Script für die Mausposition von http://www.codelifter.com/main/javascript/capturemouseposition1.html habe ich mir modifiziert, so daß es in eine Funktion gekapselt ist und mir die Koordinaten zurückgeben soll:

var IE = document.all?true:false;

if (!IE) document.captureEvents(Event.MOUSEOVER)
  tempX = 0;
  tempY = 0;

function checkPos(e) {
 if (IE) { // Mausposition für IE
        tempX = event.clientX + document.body.scrollLeft;
        tempY = event.clientY + document.body.scrollTop;

}
 else { // Mausposition für Nicht-IE
        tempX = e.pageX; // hier habe ich auch schon clientX (DOM?) versucht
        tempY = e.pageY;
 }
if (tempX < 0){tempX = 0;}
if (tempY < 0){tempY = 0;}
mousepos = new Array();
mousepos[0] = tempX;
mousepos[1] = tempY;
return mousepos;
}

Aufgerufen wird checkPos() aus einer anderen Funktion heraus, die das Ein/Ausblenden steuert und bei onmouseover auf den Punkt in der Imagemap aufgerufen wird.

Der IE 6 schluckt das ganze problemlos, und arbeitet mit den Rückgabewerten sauber weiter, aber beim Mozilla bekomme ich die Fehlermeldeung "e has no properties". Mir ist klar, daß der Haken in der Kombination der Ereignisüberwachung mit dem Eventhandler liegt, aber das Brett vor dem Kopf ist heute besonders dick - wer kann mir helfen? Vielleicht ist es ja auch nur ein kleiner Denkfehler. Ich kann leider im Moment kein Beispiel online stellen, wenn es gar nicht verständlich wurde, kann ich morgen einen Dummy basteln.

Danke für jeden Hinweis!

Gruß aus Köln-Ehrenfeld,

Elya

[Struppi]

var IE = document.all?true:false;

Naja.

if (!IE) document.captureEvents(Event.MOUSEOVER)

Warum nicht einfach testen auf das was man machen möchte?
if (document.captureEvents) document.captureEvents(Event.MOUSEOVER)

tempX = 0;
  tempY = 0;

function checkPos(e) {
if (IE) { // Mausposition für IE
        tempX = event.clientX + document.body.scrollLeft;
        tempY = event.clientY + document.body.scrollTop;

Das funktioniert nur im Quirks mode im strict mode nicht mehr.

mousepos = new Array();
mousepos[0] = tempX;
mousepos[1] = tempY;
return mousepos;

lesbarer:

var m_pos = new Object();
m_pos.top = tempY;
m_pos.left = tempX;

return m_pos;

}

Du kanst dann auf checkPos().left/top zugreifen.

Aufgerufen wird checkPos() aus einer anderen Funktion heraus, die das Ein/Ausblenden steuert und bei onmouseover auf den Punkt in der Imagemap aufgerufen wird.

Dann musst du den event noch weiterreichen. MZ gibt den an die Funktion als 1. Parameter weiter.

Struppi.

[Elya]

Hallo Struppi,

Danke für die schnelle Antwort.

var IE = document.all?true:false;
Naja.

ja ich weiß...

if (document.captureEvents) document.captureEvents(Event.MOUSEOVER)

klappt im IE

function checkPos(e) {
if (IE) { // Mausposition für IE
        tempX = event.clientX + document.body.scrollLeft;
        tempY = event.clientY + document.body.scrollTop;

Das funktioniert nur im Quirks mode im strict mode nicht mehr.

von strict bin ich bei der Vorlage leider weit entfernt ;), also kein Problem...
Mozilla schluckt aber "event" nicht

var m_pos = new Object();
m_pos.top = tempY;
m_pos.left = tempX;

return m_pos;

Du kanst dann auf checkPos().left/top zugreifen.

Danke, klappt im IE und ist schön elegant :)

Aufgerufen wird checkPos() aus einer anderen Funktion heraus,
Dann musst du den event noch weiterreichen.

Weiterreichen? Ich hab's jetzt erstmal direkt eingegeben:
document.getElementById('popup').style.left = (checkPos().left - OFFICES[id][3]) + 'px';

(wobei da noch ein gespeicherter Wert aus einem Array abgezogen wird, ist aber nicht relevant)

Klappt im IE, Mozilla meckert eben "event" als undefined an

MZ gibt den an die Funktion als 1. Parameter weiter.

Ich steh leider auf der Leitung - welcher Parameter in welcher Funktion? Ich seh wohl den Wald  vor lauter Bäumen nicht mehr.

Gruß aus Köln-Ehrenfeld,

Elya

[Struppi]

var IE = document.all?true:false;
Naja.
ja ich weiß...

Da du ja nur bei 2 sachen unterscheiden musst:

if (document.captureEvents) document.captureEvents(Event.MOUSEOVER)
klappt im IE

und im MZ

function checkPos(e) {
if (IE) { // Mausposition für IE
        tempX = event.clientX + document.body.scrollLeft;
        tempY = event.clientY + document.body.scrollTop;

Das funktioniert nur im Quirks mode im strict mode nicht mehr.
von strict bin ich bei der Vorlage leider weit entfernt ;), also kein Problem...
Mozilla schluckt aber "event" nicht

Er kennt window.event nicht.

Aufgerufen wird checkPos() aus einer anderen Funktion heraus,
Dann musst du den event noch weiterreichen.
Weiterreichen? Ich hab's jetzt erstmal direkt eingegeben:
document.getElementById('popup').style.left = (checkPos().left - OFFICES[id][3]) + 'px';

hier musst du checkPos den event weiterreichen, den du in die Funktion als 1. Parameter bekommst.

An welcheer Stelle rufst du das obige auf?

Struppi.

[Elya]

Hallo Struppi,

An welcheer Stelle rufst du das obige auf?

sorry, ich bin erst morgen wieder auf dieser Baustelle, hab heute nur noch Sternchen gesehen... Ich geh morgen mal mit hoffentlich frischem Schädel dran und melde mich dann wieder. Die Urlaubserholung ist schon wieder fast dahin ;-)

Gruß aus Köln-Ehrenfeld,

Elya

[Elya]

Hallo Struppi,
so, jetzt hab ich mich wieder reingefummelt, komme aber imemr noch nicht weiter.

if (document.captureEvents) document.captureEvents(Event.MOUSEOVER)
klappt im IE
und im MZ

genau.

Deshalb habe ich versucht, mithilfe von </archiv/2002/12/31315/> weiterzukommen, aber ich verstehe einfach nicht, was es mit dieser Funktion und deren erstem Parameter auf sich hat. Mit

if(document.implementation.hasFeature("MouseEvents", "2.0"))

kann ich zumindest den Mozilla separat erfassen, aber clientX kennt er immer noch nicht.

[Mozilla]> ... kennt window.event nicht.
exakt das ist mein Problem.

Aufgerufen wird checkPos() aus einer anderen Funktion heraus,
Dann musst du den event noch weiterreichen.
Weiterreichen? Ich hab's jetzt erstmal direkt eingegeben:
document.getElementById('popup').style.left = (checkPos().left - OFFICES[id][3]) + 'px';

hier musst du checkPos den event weiterreichen, den du in die Funktion als 1. Parameter bekommst.

da ist sie wieder, die ominöse Funktion ;-) Ich habe das Gefühl, die Welt der Events ist doch noch sehr nebulös für mich. Habe mich etwas eingelesen, aber alle Beispiele scheinen sich sich immer auf das permanente Auslesen von Werten, nicht das punktuelle auf einem bestimmten Event, zu beziehen.

An welcheer Stelle rufst du das obige auf?

Aaalso...
Unabhängig von irgendeiner Funktion führe ich
if  (document.captureEvents) document.captureEvent(Event.MOUSEOVER);
aus.

Dann habe ich die Funktion checkPos(), die mir die Werte (bei Aufruf!) zurückgeben soll:
function checkPos() {
        tempX = event.clientX + document.body.scrollLeft;
        tempY = event.clientY + document.body.scrollTop;
if (tempX < 0){tempX = 0;}
if (tempY < 0){tempY = 0;}
var m_pos = new Object();
m_pos.top = tempY;
m_pos.left = tempX;
return m_pos;
}

Zusätzlich habe ich eine Funktion, die den ganzen Ein-Ausblendkram erledigt und die Inhalte in mein Div schreibt:

(jetzt mal reduziert auf DOM-Browser:)
function showPopup(id) {

document.getElementById('popup').style.display = "block";
         [... diverses innerHTML-Gefummele]
         document.getElementById('popup').style.left = (checkPos().left - OFFICES[id][3]) + 'px';
         document.getElementById('popup').style.top = (checkPos().top - OFFICES[id][4]) + 'px';
 }

In den letzten beiden Zeilen wird checkPos() aufgerufen und mit top und left weitergerechnet. showPopup wird im HTML-Code bei mousover über eine imagemap aufgerufen und eine id übergeben.

IE führt aus, weil er event.clientX kennt. Mozilla braucht "diese" Funktion und ihren ersten Parameter. Kann mir noch jemand folgen? Wenn ja, Danke für jede Denkhilfe.

Gruß aus Köln-Ehrenfeld,

Elya

[Struppi]

da ist sie wieder, die ominöse Funktion ;-) Ich habe das Gefühl, die Welt der Events ist doch noch sehr nebulös für mich. Habe mich etwas eingelesen, aber alle Beispiele scheinen sich sich immer auf das permanente Auslesen von Werten, nicht das punktuelle auf einem bestimmten Event, zu beziehen.

Also, einen Event rufst du ja nicht selber auf, sondern er wird vom Browser "gefeuert" wenn er eintritt. Ich vermute mal du hast in deinem HTML Code ein onclick event eingebaut.

<a href="" onclick="showPop(this);">....</a>

Da ich jetzt keinen Moziall hier hab musst du ein wenig probieren. Du musst den Event weitergeben sowiet ich weiß so:
<a href="" onclick="showPop(this, Event);">....</a>

und in deiner Funktion entsprechend auswerten.

Das Ding ist, normlerweise  wirst du einen event so umbiegen:

obj.onclick = func;

function func(e)
{
if(!e) e = window.event;
}

e wird von Mozilla beim aufruf des events erzeugt und automatisch an die Funktion weitergegeben im IE musst du das globale Objekt nehmen.

Dann habe ich die Funktion checkPos(), die mir die Werte (bei Aufruf!) zurückgeben soll:
function checkPos() {
        tempX = event.clientX + document.body.scrollLeft;
        tempY = event.clientY + document.body.scrollTop;
if (tempX < 0){tempX = 0;}
if (tempY < 0){tempY = 0;}
var m_pos = new Object();
m_pos.top = tempY;
m_pos.left = tempX;
return m_pos;
}

Hier ist e auf einmal verschwunden, am Anfang war das noch da.

(jetzt mal reduziert auf DOM-Browser:)
function showPopup(id) {

Hier ist die Frage, von wo wird diese Funktion aufgerufen?

Falls du die aktuelle Mausposition brauchst schau mal hier: http://home.arcor.de/struebig/js/lib/mouse.html es ist nicht ganz so trivial.

Struppi.

[Elya]

Hallo Struppi,

Falls du die aktuelle Mausposition brauchst schau mal hier: http://home.arcor.de/struebig/js/lib/mouse.html es ist nicht ganz so trivial.

Schatzi! Äh: Struppi! Da quälst Du mich die ganze Zeit und hast es schon in der Schublade... ;-) Aber ehrlich: ich hab erst alles andere probiert und versucht, es zu verstehen, was mir immer lieber ist - aber irgendwie ist das nicht mein Thema, oder nicht mein Tag (klingeln aber auch den ganzen Tag die Kunden mit irgendwelchen abstrusen Problemen an) oder der falsche Ansatz, oder was auch immer, jedenfalls drehte ich mich weiter ohne Ergebnis im Kreis.

Kann ich die Bibliothek (kommerziell) benutzen, wenn ich die Credits drinlasse und noch ins HTML-Dokument dazuschreibe?

Vielen Dank!

Gruß aus Köln-Ehrenfeld,

Elya

[Struppi]

Falls du die aktuelle Mausposition brauchst schau mal hier: http://home.arcor.de/struebig/js/lib/mouse.html es ist nicht ganz so trivial.
Schatzi! Äh: Struppi! Da quälst Du mich die ganze Zeit und hast es schon in der Schublade... ;-) Aber ehrlich: ich hab erst alles andere probiert und versucht, es zu verstehen, was mir immer lieber ist - aber irgendwie ist das nicht mein Thema, oder nicht mein Tag (klingeln aber auch den ganzen Tag die Kunden mit irgendwelchen abstrusen Problemen an) oder der falsche Ansatz, oder was auch immer, jedenfalls drehte ich mich weiter ohne Ergebnis im Kreis.

Naja, wir sind hier ja im self Forum insofern gibt's keine fertige Skripte  ;-)

Kann ich die Bibliothek (kommerziell) benutzen, wenn ich die Credits drinlasse und noch ins HTML-Dokument dazuschreibe?

klar, ist alles offen.

Struppi.

[Elya]

Hallo Struppi,

Naja, wir sind hier ja im self Forum insofern gibt's keine fertige Skripte  ;-)

wollte ich ja auch eigentlich nicht, hab schon genug zu tun mit dem Umschreiben des "fertigen Scriptes", das ich hier liegen hatte und das nur auf IE "klappte".

klar, ist alles offen.

Danke, dann kann ich mich der nächsten Baustelle widmen ;), da gibt's leider noch einiges. Aber eigentlich macht es ja Spaß, 900-Zeilenscripte auf ein Drittel oder so zu reduzieren.

Gruß aus Köln-Ehrenfeld,

Elya