Afficher le site HTML en plein écran Plein écran

Sur la majeure partie des navigateurs, sauf peut-être Internet Explorer, il est possible de passer un objet en plein écran. L’idée est alors de construire le site à l’intérieur de cet élément, de façon à ce que tout passe en plein écran. Un exemple est proposé dans le fichier 5_12_FullScreen.html.

Il faudra naturellement anticiper l’affichage en utilisant des valeurs en pourcent, ou alors mettre à jour certains styles pour que l’affichage reste agréable en plein écran.

Donc, niveau HTML, il suffit d’avoir par exemple :

<div id="fullScreen"> 
    <input type="button" onclick="pleinEcran();" value="Plein écran" /> 
    <h1>Une page qui passe en plein écran.</h1> 
</div>

Ensuite, un événement sur un bouton ou autre pourra déclencher le script suivant permettant le passage en plein écran ou le retour à la normale.

function pleinEcran() { 
var elem = document.getElementById(’fullscreen’); 
    // Sortir du plein écran 
    if (document.FullscreenElement) { 
        document.CancelFullScreen(); 
    } else if (document.webkitFullscreenElement) { 
        document.webkitCancelFullScreen(); 
    } else if (document.mozFullscreenElement) ...