Lettore iframe di YouTube - attivazione a schermo intero su iOS

Question

Uso del player di inserimento iframe di YouTube, esiste un modo per attivare a schermo intero la programmazione a schermo intero? Voglio rimuovere i controlli predefiniti (usando i controlli = 0), ma poi ho la possibilità di creare un pulsante a schermo intero personalizzato da solo.

Answer 1

Fai iframe non a schermo intero, ma fullpage:

function fullscreen() { 
 
     var vid = document.getElementById("vid"); 
 
     vid.style.position = "absolute"; 
 
     vid.style.width = "100vw"; 
 
     vid.style.height = "100vh"; 
 
     vid.style.top = "0px"; 
 
     vid.style.left = "0px"; 
 
     document.getElementById("exit").style.display = "inline"; 
 
    } 
 
    function exitfullscreen() { 
 
     var vid = document.getElementById("vid"); 
 
     vid.style.position = ""; 
 
     vid.style.width = ""; 
 
     vid.style.height = ""; 
 
     vid.style.top = ""; 
 
     vid.style.left = ""; 
 
     document.getElementById("exit").style.display = "none"; 
 
    }

<iframe width="560" height="315" src="https://www.youtube.com/embed/fq6qcvfZldE?rel=0&amp;controls=0&amp;showinfo=0" frameborder="0" id="vid" allowfullscreen></iframe> 
 
    <button onClick="fullscreen()">Fullscreen</button> 
 
    <button style="position: fixed; 
 
        bottom: 5px; 
 
        right: 5px; 
 
        display: none; 
 
        z-index: 2000;" id="exit" onClick="exitfullscreen()">Exit Fullscreen</button>

Il pagina intera pulsante nell'angolo in alto a destra del frammento di codice funziona anche in questo modo. Se vuoi rendere il browser a schermo intero potresti provare document.requestFullscreen();, ma questo è ancora sperimentale e funziona su pochissimi browser. Dai un'occhiata all'argomento MDN di questa funzione.

MODIFICA: trovato questo: https://developers.google.com/youtube/?csw=1#player_apis, l'API ufficiale del player di YouTube.

Answer 2

provare la seguente nei browser Webkit:

if (typeof iframe.webkitRequestFullScreen === 'function') { 
    button.addEventListener('click', function() { 
     iframe.webkitRequestFullScreen(); 
    }, false); 
} 

Si noti che questa non funziona senza un gesto utente (in questo caso, 'click').

Answer 3

È possibile utilizzare questa libreria XCDYouTubeKit anziché il lettore iframe.
È molto semplice e potente. Supporta sia a schermo intero che non a schermo intero.