如何在页面加载10秒后使用自动播放启动YouTube视频?

时间:2016-02-28 11:18:51

标签: javascript jquery wordpress youtube

您好我想在页面加载完成10秒后使用自动播放启动YouTube视频。有没有办法做这个jQuery或javascript。我想在wordpress网站上这样做。 开发站点链接: -

http://www.mediationadvantage.com/(左侧的视频需要启动)

请给出一些想法或在jsfiddle上展示一些例子。

由于

2 个答案:

答案 0 :(得分:0)

如果您设置了autoplay = 1,则其中一个YouTube参数会自动播放视频将在播放器加载时自动播放,默认值为0,如此

<iframe width="420" height="315" src="http://www.youtube.com/embed/XGSy3_Czz8k">
</iframe>

所以我的想法是将这个参数autoplay=1添加到链接但是在使用setTimeout函数10秒之后,在这里开始

setTimeout(function() {
  var url = $('iframe').attr('src')
  url = url+'?autoplay=1';
  $('iframe').attr('src', url)
}, 2000); // 2000 = 2s, 10s= 10000
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<iframe width="420" height="315"
src="http://www.youtube.com/embed/XGSy3_Czz8k">
</iframe>

请参阅此PEN

答案 1 :(得分:0)

您可以添加没有任何查询参数的嵌入框架。

<iframe id="videoframe" width="560" height="315" src="https://www.youtube.com/embed/EuaYIttIowY" frameborder="0" allowfullscreen></iframe>

然后你可以在javascript中创建一个函数来改变iframe标签的属性'src'

function autoPlayVideo() {
  var videoframe = document.getElementById('videoframe');
  videoframe.src = videoframe.src + '?rel=0&autoplay=1';
}

然后你可以添加一个简单的行来设置10秒的超时

setTimeout(autoPlayVideo(), 10000);

请在此fiddle

的工作模式中查看此内容