Comment puis-je créer une fenêtre de navigateur en plein écran à l'aide de JavaScript ?

Créer une fenêtre de navigateur en plein écran avec JavaScript

La possibilité de basculer une fenêtre de navigateur en plein écran améliore l'expérience utilisateur, en particulier pour les applications. qui nécessitent de maximiser l’espace de l’écran. Cette solution JavaScript multi-navigateurs vous permet d'accéder en toute transparence au mode plein écran.

Prise en charge des navigateurs

Navigateurs modernes tels que Chrome 15, Firefox 10, Safari 5.1 et IE. 10 prend en charge nativement l’API plein écran. Les anciennes versions d'IE peuvent exploiter ActiveX pour obtenir le même résultat.

Mise en œuvre

Voici une fonction JavaScript qui détecte et utilise la méthode appropriée pour différents navigateurs :

function requestFullScreen(element) {
    // Support various browsers
    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}");
        }
    }
}

Pour utiliser cette fonction, appelez-la simplement sur l'élément que vous souhaitez développer en plein écran, par exemple, l'élément body pour l'ensemble page :

requestFullScreen(document.body);

Acceptation de l'utilisateur

Notez que le mode plein écran nécessite l'acceptation de l'utilisateur. Le déclenchement automatique n'est pas possible ; il doit être initié par un événement utilisateur, tel qu'un clic sur un bouton.

Pour plus de détails, reportez-vous à la documentation de Mozilla Developer Network sur l'utilisation du mode plein écran : https://developer.mozilla.org/en /DOM/Using_full-screen_mode

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!