Youtube延迟自动启动视频

Question

无论如何延迟YouTube视频的自动启动例如：“20秒，页面加载后？”

这里的例子只是自动启动：

http://jsfiddle.net/qbqEA/

感谢

Answer 1

它不是完美的解决方案，但它的工作原理，

<iframe class="delayed" width="486" height="273" frameborder="0" data-src="__url__" allowfullscreen=""></iframe> 

注意，我用的数据 - src而不是'src'

$(document).ready(function() { 
    setTimeout(function() { 
     $('iframe.delayed').attr('src', 
            $('iframe.delayed').attr('data-src')); 
    }, 20000); 
} 

它将在页面加载后20秒加载iframe。 看到我的叉：http://jsfiddle.net/WswGV/

Answer 2

到的IFrame的YouTube API上面的链接已经过时了，我想，但这里有一个我今天发现：

https://developers.google.com/youtube/iframe_api_reference

希望我读了很久以前的事。

从这里的例子可以看出，我建议你检测下载和准备好的播放器，然后设置一个计时器达到所需的秒数（我认为你的情况为20），然后播放视频。

--- v

Answer 3

使用https://developers.google.com/youtube/iframe_api_reference这个视频会自动启动之前将增加10秒的延迟：

<div id="player"></div> 

<script> 
    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', { 
     height: '390', 
     width: '640', 
     videoId: 'M7lc1UVf-VE', 
     events: { 
     'onReady': onPlayerReady, 
     'onStateChange': onPlayerStateChange 
     } 
    }); 
    } 

    function onPlayerReady(event) { 
    setTimeout(function() { 
     event.target.playVideo(); 
    }, 10000); 
    } 

    function stopVideo() { 
    player.stopVideo(); 
    } 
</script> 

Answer 4

做到这一点是使用YouTube.API与Jav​​aScript功能的最佳途径。

// Load the IFrame Player API code asynchronously. 
    setTimeout(function() { 
     player.playVideo(); 
    }, 20000); 
     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: '315', 
      width: '560', 
      videoId: 'I_V_kIzKKqM' 
     }); 
    } 

我希望这帮助

Answer 5

我用下面的函数

jQuery(document).ready(function() { 
 
    var frame = jQuery('.embed-responsive iframe'); 
 
    var src = frame.attr('src'); 
 
    setTimeout(function(){ frame.attr('src', src+'?autoplay=1'); }, 20000); 
 
});