zipdrive: Probleme mit mouseup bei Drag&Drop Anwendungen

Hallo ich entwickle gerade eine Drag&Drop Anwendung mit XHTML und Javascript. Ich bin dabei auf ein Problem gestoßen, dass ich auf Anhieb nicht lösen kann. Man kann das Problem schlecht beschreiben, ich versuchs aber mal!

Ich habe ein Element, das bei einem mousedown auf dieses eventhandler mousemove und mouseup registriert. Bei einem mousemove wird das element immer dahin verschoben, wo sich die Maus hinbewegt. Wenn ein mouseup stattfindet wird der mousemove eventhandler wieder gelöscht. Das Problem ist der eventhandler für mousup. Es gibt da verschiedene Szenarien, die mir Probleme bereiten. Ich ziehe die Maus über den oberen Rand des Viewports hinaus und lasse die Maus los. Wenn ich die Maus wieder in den Viewport ziehe haftet das Element natürlich weiter an der Maus, weil der Eventhandler nicht gelöscht wurde. Gleiches passiert, wenn ich bei gedrückter Maus ein anderes anderes Fenster durch [Alt]+[Tab] einblende und die Maus los lasse.

Wie könnte man ein solches Szenario beschrieben, bzw. abfragen, mir fällt nichts ein!

Grüße

  1. Hallo zipdrive,

    Wie könnte man ein solches Szenario beschrieben, bzw. abfragen, mir fällt nichts ein!

    versuch mal onmouseout zusätzlich zum onmouseup.

    Gruß, Jürgen

    1. versuch mal onmouseout zusätzlich zum onmouseup.

      Das ist mir auch schon in den Sinn gekommen, ich registriere ein mouseout für document. Ich prüfe im Handler, wo sich die Maus hinbewegt hat. Wenn ein undefined (oder null etc.) herauskommt, könnte man teoretisch damit arbeiten. Nur ein Nachteil hab ich daran entdeckt. Es schein aus mir nicht ersichtlichen Gründen der Eventhandler anzuspringen, wenn ich wieder ins document fahre. Ich hab keine Ahnung, warum der Fx (andere hab ich nicht ausprobiert) das so macht!

      Vielleicht hast du oder ihr ja eine Lösung oder erklärung für dieses Phänomen.

      Grüße

      1. versuch mal onmouseout zusätzlich zum onmouseup.

        Das ist mir auch schon in den Sinn gekommen, ich registriere ein mouseout für document. Ich prüfe im Handler, wo sich die Maus hinbewegt hat. Wenn ein undefined (oder null etc.) herauskommt, könnte man teoretisch damit arbeiten. Nur ein Nachteil hab ich daran entdeckt. Es schein aus mir nicht ersichtlichen Gründen der Eventhandler anzuspringen, wenn ich wieder ins document fahre. Ich hab keine Ahnung, warum der Fx (andere hab ich nicht ausprobiert) das so macht!

        Vielleicht hast du oder ihr ja eine Lösung oder erklärung für dieses Phänomen.

        Du machst was falsch, ich hab es grad probiert das geht so.

        Struppi.

        --
        Javascript ist toll (Perl auch!)
        1. Du machst was falsch, ich hab es grad probiert das geht so.

          Also um uns mal zu verständigen, ich habe das gebaut (jetzt mal nur für den Mozilla):

            
          document.addEventListener("mouseout",function(e) {  
             if (!e.relatedTarget) {  
                alert("Maus außerhalb des Dokumentes!");  
             }  
          },false);  
          
          

          Probier das mal bei dir aus, und sag mir wann bei dir ein alert - Meldung kommt. Bei mir kommt sie 2x, bei rein- und rausfahren ins document.

          Grüße

          1. Du machst was falsch, ich hab es grad probiert das geht so.

            Also um uns mal zu verständigen, ich habe das gebaut (jetzt mal nur für den Mozilla):

            document.addEventListener("mouseout",function(e) {
               if (!e.relatedTarget) {
                  alert("Maus außerhalb des Dokumentes!");
               }
            },false);

            
            >   
            > Probier das mal bei dir aus, und sag mir wann bei dir ein alert - Meldung kommt. Bei mir kommt sie 2x, bei rein- und rausfahren ins document.  
              
            sie kommt jedesmal wenn du auf ein anderes Element kommst, probier mal das:  
              
            ~~~javascript
            window.document.onmouseout = function(e)  
            {  
            if(!e) e = window.event;  
            var target = e.target || e.srcElement;  
            if( target.tagName.toLowerCase() == 'html')  
                alert("Maus außerhalb des Dokumentes!");  
            }  
              
            
            ~~~struppi.
            
            -- 
            [Javascript ist toll](http://javascript.jstruebig.de/) (Perl auch!)
            
            1. sie kommt jedesmal wenn du auf ein anderes Element kommst, probier mal das:

              [code lang=javascript]window.document.onmouseout = function(e)
              {
              if(!e) e = window.event;
              var target = e.target || e.srcElement;
              if( target.tagName.toLowerCase() == 'html')
                  alert("Maus außerhalb des Dokumentes!");
              }

              Selbes Verhalten, wie bei mir! Das ist auch nicht die Lösung dafür.

              Grüße

              1. Selbes Verhalten, wie bei mir! Das ist auch nicht die Lösung dafür.

                doch ist es.

                Getestet im FF 1.5, IE 6 und OP 9

                Struppi.

                --
                Javascript ist toll (Perl auch!)
                1. Getestet im FF 1.5, IE 6 und OP 9

                  Ne ist es nicht, getestet mit dem Fx 2.0.

                  Grüße

                  1. Getestet im FF 1.5, IE 6 und OP 9

                    Ne ist es nicht, getestet mit dem Fx 2.0.

                    Ich hab keinen FF 2
                    http://javascript.jstruebig.de/test/dragdrop.html

                    Der IE zeigt hier noch ein seltsames Verhalten, er feuert beim verlassen der Seite einen onmouseout übder Bild und eine mouseout des document erst beim wieder zurückkommen. OP 9 feuert sehr seltsam.

                    Struppi.

                    --
                    Javascript ist toll (Perl auch!)
                    1. Ich hab keinen FF 2
                      http://javascript.jstruebig.de/test/dragdrop.html

                      ok, zu voreilig, ich hab
                      http://javascript.jstruebig.de/test/dragdrop2.html

                      OP 9 verhält sich noch etwas schwerfällig und feuert nicht immer, aber manchmal.

                      Struppi.

                      --
                      Javascript ist toll (Perl auch!)
                      1. Hallo Struppi hallo zipdrive,

                        bei meinem Drag-and-Drop-Script http://www.j-berkemeier.de/test/beispiel_drag_and_drop_Oo.htm (http://www.j-berkemeier.de/Drag_n_Drop.js), einer überarbeiteten Version von Struppis Script, habe ich die Events nicht am Dokument, sondern an den zu ziehenden Elementen notiert. Den evtl. vorhandenen Kindern nehme ich die Events dann wieder.
                        Außerdem hole ich das angewählte Element per z-Index nach oben.
                        Das Script funktioniert bei Divs und Bildern ganz ordentlich, wenn man die Maus nicht zu schnell bewegt. Man kann Objekte auch übereinander ziehen. Nur bei der Tabelle versagt es.

                        Gruß, Jürgen

      2. Hallo zipdrive,

        ... ich registriere ein mouseout für document ...

        bei meiner Variante des Drag and Drop registriere ich alle Eventhandler am Objekt, das ich bewegen möchte, und nicht am Dokument.

        Gruß, Jürgen