Youtube iframe "loop" не работает
Я попытался использовать демоверсию для проигрывателя YouTube, чтобы генерировать код, необходимый для моего видео, для автовоспроизведения и цикла.
Но работает только автозапуск, он не зацикливается, и демо-видео тоже не работает. Вот код, который я использовал.
<iframe class="embed-responsive-item" id="ytplayer" type="text/html" width="640" height="360" src="https://www.youtube.com/embed/M7lc1UVf-VE?&autoplay=1&loop=1&rel=0&showinfo=0&color=white&iv_load_policy=3" frameborder="0" allowfullscreen>
</iframe>
Ответы
Ответ 1
Попробуйте добавить параметр playlist
вместе с циклом. Для плейлиста установите его как текущий идентификатор видео.
<iframe class="embed-responsive-item"id="ytplayer" type="text/html" width="640" height="360" src="https://www.youtube.com/embed/M7lc1UVf-VE?&autoplay=1&loop=1&rel=0&showinfo=0&color=white&iv_load_policy=3&playlist=M7lc1UVf-VE"
frameborder="0" allowfullscreen></iframe>
В настоящее время параметр цикла работает только в проигрывателе AS3 при использовании в сочетании с параметром списка воспроизведения. Чтобы закодировать одно видео, установите значение параметра цикла равным 1 и установите для параметра параметра списка воспроизведения тот же идентификатор видео, который уже указан в URL-адресе API-интерфейса проигрывателя:
http://www.youtube.com/v/VIDEO_ID?version=3&loop=1&playlist=VIDEO_ID
Ссылка: https://developers.google.com/youtube/player_parameters#loop
Ответ 2
Принятый ответ мне тоже не помог. Обходной путь на сентябрь 2018 года (бонус: установите ширину и высоту с помощью CSS для #yt-wrap
вместо жесткого кодирования в JS):
<div id="yt-wrap">
<!-- 1. The <iframe> (and video player) will replace this <div> tag. -->
<div id="ytplayer"></div>
</div>
<script>
// 2. This code loads the IFrame Player API code asynchronously.
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/player_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
// 3. This function creates an <iframe> (and YouTube player)
// after the API code downloads.
var player;
function onYouTubePlayerAPIReady() {
player = new YT.Player('ytplayer', {
width: '100%',
height: '100%',
videoId: 'VIDEO_ID',
events: {
'onReady': onPlayerReady,
'onStateChange': onPlayerStateChange
}
});
}
// 4. The API will call this function when the video player is ready.
function onPlayerReady(event) {
event.target.playVideo();
player.mute(); // comment out if you don't want the auto played video muted
}
// 5. The API calls this function when the player state changes.
// The function indicates that when playing a video (state=1),
// the player should play for six seconds and then stop.
function onPlayerStateChange(event) {
if (event.data == YT.PlayerState.ENDED) {
player.seekTo(0);
player.playVideo();
}
}
function stopVideo() {
player.stopVideo();
}
</script>
Ответ 3
При использовании в реагировать нативно, как это, убедитесь, что использовать одинаковое значение идентификатора видео для списка воспроизведения.
например, если идентификатор видео - SpongeBOB, то URL будет выглядеть так:
https://www.youtube.com/embed/ SpongeBOB? playlist = SpongeBOB & loop = 1
ниже реализация в реагировать нативное веб-представление
<WebView
javaScriptEnabled={true}
domStorageEnabled={true}
mediaPlaybackRequiresUserAction={true}
style={{ height:180, width:300,alignSelf:"center",alignContent:"center"}}
source={{uri: 'https://www.youtube.com/embed/qD101Xlc5uw?playlist=qD101Xlc5uw&loop=1' }}
/>
Ответ 4
'playlist': '<?php echo $youtube_video ?>'
внутри игрокаVars.
Например, полный код:
<script>
// 2. This code loads the IFrame Player API code asynchronously.
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
// 3. This function creates an <iframe> (and YouTube player)
// after the API code downloads.
var player;
function onYouTubeIframeAPIReady() {
player = new YT.Player('player', {
height:'100%',
width: '100%',
fitToBackground: true,
videoId: '<?php echo $youtube_video ?>',
playerVars: {
'autoplay': 1,
'controls': 0,
'autohide':1,
'enablejsapi':1,
'loop':1,
'disablekb':1,
'fs': 0,
'modestbranding': 0,
'showinfo': 0,
'color': 'white',
'theme': 'light',
'rel':0 ,
'playlist': '<?php echo $youtube_video ?>'
},
events: {
'onReady': onPlayerReady
}
});
}
// 4. The API will call this function when the video player is ready.
function onPlayerReady(event) {
event.target.playVideo();
player.mute();
player.setVolume(0);
//player.setSize(1920, 1080);
player.setLoop(true);
player.setPlaybackQuality('hd1080');
}
Ваш HTML-код:
<div id="player"></div>
Если вы хотите сохранить видео в переменной, используйте это:
<?php $youtube_video='C0DPdy98e4c';?>
Ответ 5
Я просто выясню: у вас должен быть плейлист = "" для использования цикла
src= "https://www.youtube.com/embed/peSfCy7HFrM?playlist=peSfCy7HFrM&loop=1;rel=0&autoplay=1&controls=0&showinfo=0" frameborder = "0" allowfullscreen >
Ответ 6
Вот еще один рабочий пример встроенного и зацикленного плейлиста:
<iframe width="1019" height="573" src="https://www.youtube.com/embed/videoseries?list=PLDz-3V1_TIyhVYiJeGdqc9bjpAf9L9Zfq&loop=1" frameborder="0" allow="accelerometer; autoplay " ;"="" =""="" encrypted-media;="" gyroscope;="" picture-in-picture"="" allowfullscreen=""></iframe>