Doppelbildschirm-Webumgebungen

Der auf Chromium aufsetzende Browser Microsoft Edge bietet eine leistungsstarke und kompatible Grundlage für die Darstellung von Websites und Web-Apps auf verschiedenen Geräten. Dazu gehört auch die neue Doppelbildschirm-Unterstützung beim Ausführen auf dem Surface Duo.

  • Neue Webstandards für Dual-Screen-Layouts: Sie können CSS-Primitive für Doppelbildschirm-Layouts oder die JavaScript Viewportsegment-API verwenden, um mehrere Anzeigen zu erkennen und Webinhalte in diesen Layouts anzuordnen.

  • Testen auf Surface Duo oder einem Emulator: Während sich die neuen Webstandards in der Vorschau befinden, befolgen Sie diese Anweisungen, um die Doppelbildschirm-Unterstützung auf einem Surface Duo oder im Emulator zu aktivieren.

  • Erstellen und Testen auf dem Desktop- : Sie können Doppelbildschirm-Webumgebungen auch auf dem Desktop mit Microsoft Edge oder Chrome erstellen und testen. Befolgen Sie diese Anweisungen zum Aktivieren der Doppelbildschirm-Entwicklertools.

  • Progressive Web Apps (PWAs) : PWAs werden in der neuen Microsoft Edge-Version standardmäßig unterstützt. Sie können unter Android direkt im Browser installiert werden. PWAs unterstützen die gleichen Features und Tools des Layouts für Doppelbildschirme wie der Browser.

Zusätzliche Ressourcen

In Einführung in Doppelbildschirmgeräte stellen wir verschiedene Möglichkeiten vor, wie du vorhandene Features und Techniken nutzen kannst, um deine App auf Geräten mit Doppelbildschirm besser zu gestalten. In dieser vorhandenen Dokumentation erfährst du mehr über die Implementierung dieser Features in Web-Apps.

Feature Weitere Informationen
Layouts dynamischer Apps Die Bausteine des dynamischen Designs (Mozilla)
Unterstützung verschiedener Eingaben PointerEvent (Mozilla)
Drag & Drop HTML-Drag & Drop-API- (Mozilla)
Bild-in-Bild für Medien Bild-in-Bild (W3C)
Bild-in-Bild-Beispiel (Chrome)