AlxDe: OnMouseOut

Folgender HTML-Code funktioniert weder beim IE, noch bei Firefox wie gewünscht:

<p onmouseout="alert('mouse out')">
abcd<b>efg</b>hijkl
</p>

Wenn man nämlich die Maus aus dem normalen Text in den fettgedruckten bewegt, oder umgekehrt, wird ein MouseOut-Ereignis ausgelöst, obwohl man den p-Bereich nicht verlassen hat.
Dabei ist es völlig egal, mit welchen Tags man arbeitet. Sogar z.B.

<font onmouseout="alert('mouse out')">
abcd<font>efg</font>hijkl
</font>

funktioniert nicht.
Ich kann schlecht nicht vorstellen, dass diese Funktionalität so gewollt/definiert ist.
Welche Lösung gibt es, um MouseOut beim Verlassen eines übergeordneten Tag-Bereiches, das "Untertags" enthält, auszulösen?

  1. Hast Du schonmal unter dem Stichwort "event bubbling" gesucht?

    Gruß
    Avalon

    1. Hallo Avalon,

      funktioniert leider nicht :-(

      Trotzdem Danke,
      AlxDe

      <HTML>
      <HEAD>
      <TITLE></TITLE>

      <script>
      function test() {
      window.event.cancelBubble = true;
      }
      </script>

      </HEAD>
      <BODY onload="test()">

      <font onmouseout="alert('mouse out')">
      abcd<font>efg</font>hijkl
      </font>

      </BODY>
      </HTML>

  2. Hallo AlxDe,

    seltsamer Effekt, das wusste ich auch noch nicht, widerspricht ja jeder Logik. Mit Event-Bubbling oder -Propagation kannst du dem meines Erachtens auch nicht begegenen. Allenfalls mit einer global definierten Flagge in Kombination mit einem Timeout, das man seltsamerweise auf 0 Millisekunden runtersetzen, aber nicht weglassen kann:

      
    <!doctype html public "-//W3C//DTD HTML 4.0 //EN">  
    <html>  
    <head>  
    <title>Mouseout-Workaround</title>  
    <script type="text/javascript">  
    [code lang=javascript]  
    var raus;  
      
    function melden () {  
     if(raus)alert('mouse out');  
    }  
    
    

    </script>
    </head>
    <body >
    <p onmouseover="raus=false" onmouseout="window.setTimeout('melden()',0);raus=true">
    abcd<b onmouseout="melden();raus=true">efg</b>hijkl
    </p>
    </body>
    </html>
    [/code]

    Gruß Gernot

    1. Das läuft, danke!

      AlxDe

    2. Das sieht mir alles recht exotisch aus.

      Für diejenigen, die es richtig machen wollen:

      http://www.faqts.com/knowledge_base/view.phtml/aid/1606/fid/145

      Gruß
      Avalon

      1. Hallo Avalon,

        Das sieht mir alles recht exotisch aus.

        Du scheinst im englischsprachigen Kulturkreis ja sehr zuhause zu sein.

        Für diejenigen, die es richtig machen wollen:

        http://www.faqts.com/knowledge_base/view.phtml/aid/1606/fid/145

        Ich kann im Moment nicht erkennen, inwiefern die hier vorgestellte Lösung die "Richtigere" für AlxDes Problem sein sollte. Meine ist jedenfalls objektiv schlanker und funktioniert.

        (Getestet unter Win98 mit IE6, Mozilla 1.7.2, Netscape 7.1, Opera 7.54)

        Gruß Gernot

  3. Hi,

    Vorschlag:

    Fasse alles unter einen <span onmouseout=alert"hallo"></span> zusammen

    meiner Meinung nach klappt es

    Gruss

    Maulwurf

    1. Hallo Maulwurf,

      Fasse alles unter einen <span onmouseout=alert"hallo"></span> zusammen

      meiner Meinung nach klappt es

      Du wirfst ja alles über den Haufen!

      Gruß Gernot

      1. Hallo Gernot,

        Du wirfst ja alles über den Haufen!

        Warum?

        Gruss

        Maulwurf

        1. Hallo Maulwurf,

          Warum?

          a) Weil man keine Blockelemete in Inline-Elemente schachteln darf,
          b) Weil eine weitere Verschachtelung, selbst in ein Blockelement, nichts bringt,
          c) Weil das keine Frage von Meinung ist.

          Gruß Gernot

          1. Hallo Gernot

            folgenden code gerade getestet in Firefox:

            <html>
            <head>
            <title></title>
            </head>
            <body>
            <span onmouseout="alert('mouse out')">
            <p >
            abcd1234567890<b>efg</b>hijkl
            </p>
            </span>
            </body>
            </html>

            funktioniert wie eine Eins

            Gruss

            Maulwurf

            1. Hallo Maulwurf,

              ich erhalte aber ein mouseOut, wenn ich vom normalen Text in den fetten komme.

              Gruß,
              Alex

            2. hi,

              folgenden code gerade getestet in Firefox:
              [...]
              <span onmouseout="alert('mouse out')">
              <p >
              abcd1234567890<b>efg</b>hijkl
              </p>
              </span>
              [...]
              funktioniert wie eine Eins

              ist aber trotzdem nicht korrekt, weil - wie dir schon gesagt wurde - span kein p enthalten darf.

              gruß,
              wahsaga

              --
              /voodoo.css:
              #GeorgeWBush { position:absolute; bottom:-6ft; }