youtubeの動画をページに4つ埋め込み、自動再生・ループ・ミュートで再生したいのですが、
iPhone実機にてうまく動作しません。
下記のコードをどのようにすれば良いのでしょうか。
html
1<div id="player1"></div> 2<div id="player2"></div> 3<div id="player3"></div> 4<div id="player4"></div>
javascript
1var tag = document.createElement('script'); 2 3tag.src = "https://www.youtube.com/iframe_api"; 4var firstScriptTag = document.getElementsByTagName('script')[0]; 5firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); 6 7var youtubeVideos = [ 8{ 9 youtubeId: '〇〇', 10 embedArea: 'player1' 11}, { 12 youtubeId: '〇〇', 13 embedArea: 'player2' 14}, { 15 youtubeId: '〇〇', 16 embedArea: 'player3' 17}, { 18 youtubeId: '〇〇', 19 embedArea: 'player4' 20} 21]; 22 23function onYouTubeIframeAPIReady() { 24for (var i = 0; i < youtubeVideos.length; i++) { 25 youtubeVideos[i]['embedArea'] = new YT.Player(youtubeVideos[i]['embedArea'], { 26 height: '360', 27 width: '640', 28 videoId: youtubeVideos[i]['youtubeId'], 29 events: { 30 'onReady': onPlayerReady, 31 'onStateChange': onPlayerStateChange 32 } 33 }); 34} 35} 36 37function onPlayerReady(event) { 38 event.target.mute(); 39 event.target.playVideo(); 40} 41 42function onPlayerStateChange(event) { 43 if (event.data == YT.PlayerState.ENDED) { 44 event.target.playVideo(); 45 } 46}
よろしくお願い致します。
あなたの回答
tips
プレビュー