PDA

View Full Version : YouTube loop autoplay



chechu
01-05-2017, 05:50 PM
Hey all,

You can see the following code being used on this site: http://www.brunomazereel.com


<script src="http://www.youtube.com/player_api"></script>
<script type="text/javascript">
var player;

function onYouTubePlayerAPIReady() {
player = new YT.Player('player', {
playerVars: {
'autoplay': 1,
'controls': 0,
'autohide': 1,
'wmode': 'opaque',
'showinfo': 0,
'loop': 1,
'playlist': 'MAtwgOsycc0'
},
videoId: 'MAtwgOsycc0',
events: {
'onReady': onPlayerReady
}
});

}

function onPlayerReady(event) {
event.target();
$('#text').fadeIn(400);
}

$(window).scroll(function() {
var hT = $('.m-video').height(),
wS = $(this).scrollTop();
if (wS > hT) {
player.pauseVideo();
}
else {
player.playVideo();
}
});
</script>


The video starts automatically.
Now I would like another video to start straight after that one, so I adjusted this part adding another video:


'playlist': 'MAtwgOsycc0,Pq_0xbfiePs'
},
videoId: 'MAtwgOsycc0,Pq_0xbfiePs',

It works, the second video starts immediately after the first one, but now the first video doesn't start automatically anymore.
Any idea how that can be resolved, please?
Thanks!

molendijk
01-08-2017, 12:03 AM
This should work. Not tested though
<script src="http://www.youtube.com/player_api"></script>
<script>
var player;

function onYouTubePlayerAPIReady() {
player = new YT.Player('player', {
playerVars: {
'autoplay': 1,
'controls': 0,
'autohide': 1,
'wmode': 'opaque',
'showinfo': 0,
'loop': 1,
'playlist': 'Pq_0xbfiePs'
},
videoId: 'MAtwgOsycc0',
events: {
'onReady': onPlayerReady
}
});

}

function onPlayerReady(event) {
event.target();
$('#text').fadeIn(400);
}

$(window).scroll(function() {
var hT = $('.m-video').height(),
wS = $(this).scrollTop();
if (wS > hT) {
player.pauseVideo();
}
else {
player.playVideo();
}
});
</script>

chechu
01-10-2017, 07:47 PM
Works perfectly, thanks.
To add more videos, just continue like this:

'playlist': 'nvENEbvSMW4,gjElHVZ4f14'
},
videoId: 'MAtwgOsycc0',