David: Firefox und event-handling: ich ver2fle!!

Eigentlich sollte es ein ganz einfaches skript werden, aber nun sitze ich schon tagelang daran und komm nicht weiter (beim IE klappt es problemlos mit event.pageX, aber Firefox macht Probleme). Kann mir jemand helfen?

ich habe einen layer:

<div id="test"
style="background-color:red;
position:absolute;
top:100;
left:200;
visibility:hidden"><h1>Hallo</h1></div>

Und ich habe einen Link:

<a href="javascript:;">Link</a>

Nun möchte ich, dass wenn man mit der Maus über den Link fährt der Layer erscheint, aber nicht irgendwo, sondern dort, wo die Maus gerade ist.  Geht man mit der Maus vom Link weg, dann soll der Layer wieder verschwinden.

function init_mousemove() {
        if(document.layers)document.captureEvents(Event.ONMOUSEOVER);
        document.onmouseOver = dpl_mouse_pos;
    }

function dpl_mouse_pos(e) {

// position where mousemove fired
        //
        var xPos    =  e? e.pageX : window.event.x;
        var yPos    =  e? e.pageY : window.event.y;

// for ie add scroll position
        //
        if (document.all && !document.captureEvents) {
            xPos    += document[docEl].scrollLeft;
            yPos    += document[docEl].scrollTop;
        }

window.status = "Left = " +xPos +" : Top = " +yPos;

// for the dino pass event
        //
        if (document.layers) routeEvent(e);
        show(xPos,yPos)
    }

Soweit so gut. Dieser Skript gibt mir zwar im Firefox die Koordinaten    in der Statuszeile aus, aber ich schaffs nicht, dass der layer dann richtig erscheint und wieder verschwindet, weil capture.events ja dann ständig läuft und nicht nur einmal.

Wäre wirklich froh, wenn jemand helfen könnte!

  1. PS: Beispiel unter www.reduts.net/fisibach/start.php
    (mit IE kappts einwandfrei, aber nicht unter Firefox)

  2. hallo,

    <div id="test"
    style="background-color:red;
    position:absolute;
    top:100;
    left:200;
    visibility:hidden"><h1>Hallo</h1></div>

    Das kann man so machen, aber günstiger (weil leichter wartbar) ist es, die CSS-Angaben mindestens in einen <style>-Bereich im Header oder ganz und gar in eine externe CSS zu stopfen.

    Und ich habe einen Link:
    <a href="javascript:;">Link</a>

    Oh. Was, bitteschön, soll denn da aufgerufen werden? Da muß für "javascript" doch wenigstens der Name einer Funktion her.

    function init_mousemove() {
            if(document.layers)document.captureEvents(Event.ONMOUSEOVER);
            document.onmouseOver = dpl_mouse_pos;
        }

    Wer hat dir denn verklickert, daß du "document.layers" nehmen und nicht einmal ain "else" vorsehen sollst? Was du hier machen möchtest, funktioniert ausschließlich mit Netscape 4 oder älter - hat also aktuell keinerlei Bedeutung.

    if (document.all && !document.captureEvents) {

    Das ist etwas Ähnliches, hier wird IE 4 geprüft. Du verwendest ein offensichtlich sehr altes Script, das du nie wirklich durchdacht hast. Wenn man mit Javascript "Browserweichen" bauen will, dann sollte man andere Kriterien nehmen - zum Beispiel nach DOM-Fähigkeit fragen.

    Soweit so gut.

    Nö. So weit, so unverständlich.

    Dieser Skript

    Kruzitürkenhimmelkreuzdonnerwetter - es heißt nicht "dieser" Script. Es gibt nichts, was an einem Script männlich wäre. Grrrrrrrrrrrmpf. Dein Script ist derart kindlich naiv, daß es eben sächlich sein _muß_.

    Und dann hast du noch etliches zwar nicht geschrieben, aber auf deiner Seite verewigt. Da gibt es im Header einzig und allein etwas CSS, aber kein Javascript, trotzdem beginnt die Seite mit
      <body onload ...>
    Ja, was soll denn da geladen werden? Wenig danach gibt es auch wieder das seit Jahren gescholtene und nicht mehr ausreichende
      <script language="JavaScript">
    Hier fehlt "type". Wenn man sich die Funktionen, die du da versammelt hast, anschaut, gibt es wenigstens einen Hoffnungsschimmer, weil in "function weg()" wenigstens nach document.getElementById() gefragt wird.

    Wäre wirklich froh, wenn jemand helfen könnte!

    Ich fürchte, das geht nicht mit einer Hauruck-Aktion. Prophylaktisch könntest du dich einmal wieder mit dem Javascript-Kapitel in SELFHTML beschäftigen.

    Grüße aus Berlin

    Christoph S.

    --
    Visitenkarte
    SELFTreffen Dresden
    ss:| zu:) ls:& fo:) va:) sh:| rl:|
  3. Hallo David,

    Soweit so gut. Dieser Skript gibt mir zwar im Firefox die Koordinaten    in der Statuszeile aus, aber ich schaffs nicht, dass der layer dann richtig erscheint und wieder verschwindet, weil capture.events ja dann ständig läuft und nicht nur einmal.

    Da Firefox ja sehr standardkonform arbeitet, solltest du vielleicht mal eher sehen, ob du statt mit pageX und pageY mit clientX bzw. clientY oder mit srceenX bzw. screenY weiterkommst.

    Ob diese Eigenschaften jeweils funktionieren, kannst du ja auch direkt abfragen z.B. mit if(event.clientX).

    Gruß Gernot

    1. Das ist ja das Problem: bei firefox geht weder clientX noch screenX noch pageX. Ich weiss nicht wie %-|

      1. Hallo David,

        Das ist ja das Problem: bei firefox geht weder clientX noch screenX noch pageX. Ich weiss nicht wie %-|

        Doch doch, das geht schon alles mit Firefox, geht ja auch auf der Seite, von der du wahrscheinlich den Code hast:

        http://www.wendenburg.de/jstipps/mousepos.php

        Wie es sich allerdings in Verbindung mit deinem Vorhaben verhält, darüber ein Element an der Mausposition über dem Link einzublenden, kann ich nicht sagen, denn wie deine Funktion show(xPos,yPos) funktioniert, sehen wir ja nicht. Möglicherweise hilft es, den "Layer" um einen Pixel nach rechts und nach unten von der Mausposition abzusetzen, damit nicht durch Einblenden des Layers und damit Überdecken des Links gleich wieder ein Mouseout-Event eintritt.

        Gruß Gernot