YouTube iframeプレーヤー - iOSで全画面表示

Question

YouTubeのiframe埋め込みプレーヤーを使用すると、プログラムでフルスクリーンをトリガーする方法はありますか？私はデフォルトのコントロール（コントロール= 0を使用して）を削除したいが、カスタムフルスクリーンボタンを単独で作成することができる。

Answer 1

はインラインフレームがフルスクリーンが、フルページではない作る：

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>

コードスニペットの右上隅にある全ページボタンもこのように動作します。ブラウザをフルスクリーンにしたい場合は、document.requestFullscreen();を試すことができますが、これはまだ実験的であり、非常に少数のブラウザで動作します。この機能のトピックMDNを見てください。

編集：ちょうどこれを見つけた：https://developers.google.com/youtube/?csw=1#player_apis、公式のYouTubeプレーヤーAPI。

Answer 2

はWebkitのブラウザで次のことを試してみてください。これは、ユーザーのジェスチャーなしで動作しないこと

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

注意を（この場合には、「クリック」）。

Answer 3

iframe playerの代わりにこのライブラリXCDYouTubeKitを使用できます。
非常にシンプルで強力です。フルスクリーンと非フルスクリーンをサポートします。