I can't work out how to autoplay a video using the new embed code style for Youtube. I tried adding &autoplay=1 to the url, which worked with the old style, but it didn't work. For example, http://www.youtube.com/embed/JW5meKfy3fY is the embed link, but http://www.youtube.com/embed/JW5meKfy3fY&autoplay=1 doesn't work. Can anyone tell me how to do it? Thanks
12 Answers
Actually, you will have to use the "?" instead of "&" for your first parameter only. If you use more than one parameter, you will then have to add "&" to the chain.
For instance, if you want to add autoplay and closed captioning, you will have to add this portion to your embedded video URL: ?autoplay=1&cc_load_policy=1.
It would look like this:
<iframe width="420" height="315" src="http://www.youtube.com/embed/
oHg5SJYRHA0?autoplay=1&cc_load_policy=1" frameborder="0"
allowfullscreen></iframe>
The only way I was able to get autoplay to work was to use the iframe player api.
<div id="ytplayer"></div>
<script>
// Load 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);
// Replace the 'ytplayer' element with an <iframe> and
// YouTube player after the API code downloads.
var player;
function onYouTubePlayerAPIReady() {
player = new YT.Player('ytplayer', {
height: '480',
width: '853',
videoId: 'JW5meKfy3fY',
playerVars: {
'autoplay': 1,
'showinfo': 0,
'controls': 0
}
});
}
</script>
Okay this is an example for the new embed code for youtube videos.
<iframe title="YouTube video player" class="youtube-player" type="text/html" width="560" height="345" src="http://www.youtube.com/embed/8v_4O44sfjM" frameborder="0" allowFullScreen></iframe>
if you want to autoplay it, at the src="http://www.youtube.com/embed/8v_4O44sfjM"
add the ?autoplay=1
parameter
So the code will look like this:
<iframe title="YouTube video player" class="youtube-player" type="text/html" width="560" height="345" src="http://www.youtube.com/embed/8v_4O44sfjM?autoplay=1" frameborder="0" allowFullScreen></iframe>
i tried this on my blog and it works ! Hope this help (:
You are using a wrong url for youtube auto play http://www.youtube.com/embed/JW5meKfy3fY&autoplay=1
this url display youtube id as wholeJW5meKfy3fY&autoplay=1
which youtube rejects to play. we have to pass autoplay variable to youtube, therefore you have to use ?
instead of &
so your url will be http://www.youtube.com/embed/JW5meKfy3fY?autoplay=1
and your final iframe will be like that.
<iframe src="http://www.youtube.com/embed/xzvScRnF6MU?autoplay=1" width="960" height="447" frameborder="0" allowfullscreen></iframe>
None of yours are solved my problem. But, I found a good solution for me to work properly right now. In between tags write this code:
<div style="position: fixed; z-index: -99; width: 100%; height: 100%">
<iframe frameborder="0" height="100%" width="100%"
src="https://youtube.com/embed/**[CHANGE HERE WITH YOUR YOUTUBE VIDEO ID]**?autoplay=1&controls=0&showinfo=0&autohide=1">
</iframe>
</div>
YouTube auto play works only desktop in need to work mobile just make changes in JavaScript. Like
<div id="player"></div>
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/iframe_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
var player;
function onYouTubeIframeAPIReady() {
player = new YT.Player('player', {
videoId: 'VideoID',
playerVars: {
'autoplay': 1,
'rel': 0,
'showinfo': 0,
'modestbranding': 1,
'playsinline': 1,
'showinfo': 0,
'rel': 0,
'controls': 0,
'color':'white',
'loop': 1,
'mute':1,
// 'origin': 'https://meeranblog24x7.blogspot.com/'
},
events: {
'onReady': onPlayerReady,
// 'onStateChange': onPlayerStateChange
}
});
}
function onPlayerReady(event) {
player.playVideo();
player.mute();
}var done = false;
function onPlayerStateChange(event) {
if (event.data == YT.PlayerState.PLAYING && !done) {
setTimeout(stopVideo, 6000);
done = true;
}
}
function stopVideo() {
player.stopVideo();
}
See More :- YouTube auto play for 5 seconds