Wie erstelle ich mit JavaScript ein Browserfenster im Vollbildmodus?

So erstellen Sie ein Fenster im Vollbildmodus mit Javascript (Ausdehnung über den gesamten Bildschirm)

Einführung

Erreichen eines vollständigen Fensters Das Bildschirmerlebnis Ihrer Website-Besucher ist entscheidend für immersive Inhalte. In der Vergangenheit war dies aufgrund von Browserkompatibilitätsproblemen eine Herausforderung. Mit dem Aufkommen moderner Browser und der Weiterentwicklung von JavaScript ist es jedoch möglich geworden, ein Fenster relativ einfach in den Vollbildmodus zu versetzen.

Lösung

Um ein Um den Browser des Besuchers mithilfe von JavaScript in den Vollbildmodus zu versetzen, können Sie Folgendes nutzen Ansatz:

function requestFullScreen(element) {
    // Supports most browsers and their versions.
    var requestMethod = element.requestFullScreen || element.webkitRequestFullScreen || element.mozRequestFullScreen || element.msRequestFullScreen;

    if (requestMethod) { // Native full screen.
        requestMethod.call(element);
    } else if (typeof window.ActiveXObject !== "undefined") { // Older IE.
        var wscript = new ActiveXObject("WScript.Shell");
        if (wscript !== null) {
            wscript.SendKeys("{F11}");
        }
    }
}

var elem = document.body; // Make the body go full screen.
requestFullScreen(elem);

Erklärung

• Die Funktion requestFullScreen() prüft, ob die nativen Vollbild-Anforderungsmethoden von verschiedenen Browsern unterstützt werden.
• Wenn eine native Methode verfügbar ist, ruft sie diese Methode für das angegebene Element auf (in diesem Fall das Body-Element, um die gesamte Seite voll zu machen). Bildschirm).
• Bei älteren Versionen von Internet Explorer wird ein ActiveXObject verwendet, um den F11-Tastendruck zu senden, der den Vollbildmodus auslöst.

Zusätzliche Hinweise

• Der Vollbildmodus erfordert die Zustimmung des Benutzers, daher ist es wichtig, dass eine vom Benutzer initiierte Aktion (z. B. eine Schaltfläche) vorhanden ist klicken), um die Anfrage auszulösen.
• Einige ältere Browser unterstützen diese Funktionalität möglicherweise nicht vollständig, daher wird empfohlen, vor der Implementierung dieser Lösung die Browserkompatibilität zu überprüfen.

Referenz

• [Vollbildmodus verwenden | MDN](https://developer.mozilla.org/en/DOM/Using_full-screen_mode)

Das obige ist der detaillierte Inhalt vonWie erstelle ich mit JavaScript ein Browserfenster im Vollbildmodus?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!