ScreenDetails: screenschange-Ereignis
Eingeschränkt verfügbar
Diese Funktion ist nicht Baseline, da sie in einigen der am weitesten verbreiteten Browser nicht funktioniert.
Want more browser support for this feature? Tell us why.
Experimentell: Dies ist eine experimentelle Technologie
Überprüfen Sie die Browser-Kompatibilitätstabelle sorgfältig vor der Verwendung auf produktiven Webseiten.
Sicherer Kontext: Diese Funktion ist nur in sicheren Kontexten (HTTPS) in einigen oder allen unterstützenden Browsern verfügbar.
Das screenschange-Ereignis der ScreenDetails-Schnittstelle wird ausgelöst, wenn sich die Menge der für das System verfügbaren Bildschirme ändert: Ein neuer Bildschirm ist verfügbar geworden oder ein bisher verfügbarer Bildschirm ist nicht mehr verfügbar. Diese Änderung zeigt sich im screens-Array.
Syntax
Verwenden Sie den Ereignisnamen in addEventListener():
addEventListener("screenschange", (event) => { })
Alternativ können Sie ihn der Event-Handler-Eigenschaft der Schnittstelle zuweisen:
onscreenschange = (event) => { }
Ereignistyp
Ein generisches Event.
Beispiele
Sie können das screenschange-Ereignis verwenden, um Änderungen an den verfügbaren Bildschirmen zu erkennen, die Änderung zu melden, alle Fenster zu schließen und sie anschließend passend zur neuen Konfiguration wieder zu öffnen:
const screenDetails = await window.getScreenDetails();
// Return the number of screens
let noOfScreens = screenDetails.screens.length;
screenDetails.addEventListener("screenschange", () => {
// If the new number of screens is different to the old number of screens, report the difference
if (screenDetails.screens.length !== noOfScreens) {
console.log(
`The screen count changed from ${noOfScreens} to ${screenDetails.screens.length}`,
);
// Update noOfScreens value
noOfScreens = screenDetails.screens.length;
}
// Open, close, or rearrange windows as needed, to fit the new screen configuration
updateWindows();
});
Spezifikationen
| Spezifikation |
|---|
| Window Management # eventdef-screendetails-screenschange |
| Window Management # ref-for-dom-screendetails-onscreenschange |