HTML5: utilizzare le Fullscreen API
Le Fullscreen API forniscono metodi per richiedere all'utente la visualizzazione a tutto schermo dell'intera pagina o di un particolare elemento.
L'utilizzo è semplice, tuttavia non trattandosi ancora di una funzionalità standard va utilizzato con i vendor-prefix: si rende quindi necessario un piccolo layer di compatibilità.
Vediamo come realizzarlo.
Per prima cosa definisco due funzioni che cercano il metodo corretto per il browser che sta visualizzando il documento e lo richiamano: una per l'ingresso in modalità fullscreen (righe 7-17) e una per l'uscita (righe 19-29).
La funzione enterFullScreen può essere utilizzata in 2 modi: per far entrare in fullscreen l'intera pagina
o solamente un particolare elemento del DOM, ad esempio un video:
exitFullScreen() viene invece richiamata senza parametri.
L'utilizzo è semplice, tuttavia non trattandosi ancora di una funzionalità standard va utilizzato con i vendor-prefix: si rende quindi necessario un piccolo layer di compatibilità.
Vediamo come realizzarlo.
Per prima cosa definisco due funzioni che cercano il metodo corretto per il browser che sta visualizzando il documento e lo richiamano: una per l'ingresso in modalità fullscreen (righe 7-17) e una per l'uscita (righe 19-29).
La funzione enterFullScreen può essere utilizzata in 2 modi: per far entrare in fullscreen l'intera pagina
enterFullScreen(document.documentElement);
o solamente un particolare elemento del DOM, ad esempio un video:
enterFullScreen(document.getElementById('videoObj'))
exitFullScreen() viene invece richiamata senza parametri.
Compatibile con Safari, Chrome, Firefox |