Norbert49: Verschiebare Elemente auf Webseite in Tablet, Smartfon & Co darstellen

Hallo zusammen,

weiß jemand, wie sich die Darstellung von langen Webseite auf mobilen Geräten verhält, wenn draggable Divs mit Touch verschoben werden sollen? Erkennt der Browser das, oder scrollt er die Seite?

Vielen Dank und schönen Gruß Norbert

  1. weiß jemand, wie sich die Darstellung von langen Webseite auf mobilen Geräten verhält, wenn draggable Divs mit Touch verschoben werden sollen?

    Die Frage wie sich Nutzer verhalten finde ich interessanter. Ich fand diese Frage so interessant daß mich die Antwort interessiert hat. Und seit ich die Antwort kenne, finde ich Drag+Dop auf mobilen Geräten blödsinnig. MFG

    1. Hallo pl,

      Die Frage wie sich Nutzer verhalten finde ich interessanter. Ich fand diese Frage so interessant daß mich die Antwort interessiert hat. Und seit ich die Antwort kenne, finde ich Drag+Dop auf mobilen Geräten blödsinnig.

      Interessant, dass du weißt, wie sich Nutzer verhalten.

      Ich könnte mir vorstellen, dass Nutzer genau wissen, wie sie Elemente verschieben können wenn sie denn wollten.

      Bei meiner Website (die ich nicht zeigen kann), funktioniert das drag 'n' drop in mobilen Firefox und Chrome nicht.

      Bis demnächst
      Matthias

      --
      Pantoffeltierchen haben keine Hobbys.
      ¯\_(ツ)_/¯
      1. Hallo Matthias,

        ich weiß ja nicht mal, ob es überhaupt eine allgemeingültige Geste für Drag&Drop auf Touch-Geräten gibt. Gibt's eine?

        Rolf

        --
        sumpsi - posui - clusi
        1. Hallo Rolf B,

          ich weiß ja nicht mal, ob es überhaupt eine allgemeingültige Geste für Drag&Drop auf Touch-Geräten gibt. Gibt's eine?

          Ich würde intuitiv länger drauf tappen und dann schieben.

          Bis demnächst
          Matthias

          --
          Pantoffeltierchen haben keine Hobbys.
          ¯\_(ツ)_/¯
          1. Hallo Matthias,

            dito. Und dann habe ich im Netz gesucht. Offenbar ist man bei Windows Phone anderer Meinung gewesen. Tap, dann ziehen. Ok, niemanden (mehr) interessiert Windows Phone, aber ich war doch verunsichert.

            Rolf

            --
            sumpsi - posui - clusi
      2. Lieber Matthias,

        Bei meiner Website (die ich nicht zeigen kann), funktioniert das drag 'n' drop in mobilen Firefox und Chrome nicht.

        mein Quiz-Mechanismus nutzt verschiebbare Elemente für drag&drop-Aufgaben. Das sollte insbesondere auch auf Touch-Geräten wie beabsichtigt funktionieren.

        Liebe Grüße,

        Felix Riesterer.

        1. Hallo,

          mein Quiz

          ist kaputt! Es will nicht akzeptiern, dass die Biene ein Nutztier ist…

          Gruß
          Kalk

        2. Hej Felix,

          mein Quiz-Mechanismus nutzt verschiebbare Elemente für drag&drop-Aufgaben. Das sollte insbesondere auch auf Touch-Geräten wie beabsichtigt funktionieren.

          Da sehe ich (noch) diverse Probleme. Nehmen wir mal das zweite Beispiel:

          Die Aufgabe lautet

          #Zuordnungs-Quiz (gruppenweise) Ordnen Sie folgende Begriffe/Dinge einander zu, indem Sie die grünen Felder mit der Maus verschieben!

          Da gibt es relativ viele Begriffe, die auf kleinen Smartphones vermutlich außerhalb des Bildschirms liegen dürften (mindestens teilweise). Es dürfte sehr fummelig sein und bedarf auch neben der beabsichtigen Aufgabe (was gehört wozu) die Fähigkeit, sich zu merken, welche Gruppen es gibt, dann an einen Punkt zu scrollen, wo man die Gruppen womöglich nicht mehr sieht und sich ein Element zu suchen, dass zu den gemerkten Gruppen passt und dieses dann an den oberen Bildschirmrand zu ziehen in der Hoffnung, dass man so wieder mit dem Icon am Finger nach oben scrollen kann.

          Menschen mit entsprechender Erfahrung können das vermutlich, aber man ist sich nie sicher, ob ein bestimmter Quizteilnehmer, an der eigentlichen Aufgabe oder an dem Verfahren gescheitert ist.

          Außerdem schließt die Formulierung „grüne Felder verschieben“ 10% der Männer wegen rot-grün-Fehlsichtigkeiten aus. - Mir scheinen die Felder auch gelb(?) hinterlegt zu sein.

          Es hat mich auch einiges rumprobieren gekostet, bis ich verstanden habe, welche Elemente sich verschieben lassen - und welche nicht. Hier würde ich die Gestaltung unterschiedlich machen.

          PS: sorry, dass ich auf die eigentliche Frage nciht eingegangen bin, habe so etwas noch nicht umgesetzt und daher auch keine Testerfahrung, daher nur, was mir aufgefallen ist, als ich die Seite kurz getestet habe (Desktop-Safari - hat sich übrigens einmal "aufgehangen" und ich musste die Seite neu laden).

          Marc

          --
          Ceterum censeo Google esse delendam
  2. Lieber Norbert49,

    Erkennt der Browser das, oder scrollt er die Seite?

    er scrollt die Seite. Oder wie hast Du die Verschiebbarkeit der Elemente umgesetzt?

    Liebe Grüße,

    Felix Riesterer.

  3. Hallo Norbert,

    ich glaube, die Browser helfen einem da nicht. Wenn du das move-Event abfängst, bewegt sich das Objekt, das Scrollen ist aber unterdrückt. Das kann man bei kleinen Objekten machen. Bei dieser Seite (auf „3D Plot“ klicken, das Bild kann gedreht und der Kasten bewegt werden) verfahre ich so.

    Bei größeren oder seitenfüllenden Objekten führt das dazu, das die Seite nicht mehr gescrollt werden kann. Hier muss man sich selbst bzw. die Bibliothek muss sich darum kümmern, dass das move-Event weitergeleitet wird.

    Google Maps nimmt den Einfinger-Move zum Scrollen, den Zweifinger-Move zum Verschieben der Karte. (Beispiel)

    Leaflet verfährt ähnlich, nur das beim Einfingermove gescrollt und die Karte bewegt wird. (Beispiel)

    Gruß
    Jürgen