video通过javascript隐藏但已经开始播放（自动播放模式），即使它不可见？

我想找到一种简单的方法，通过隐藏它们并在点击预览图像后立即显示我的博客中的video来获取自定义预览图像。 用户Dominic Green帮助我开始使用以下代码。 问题是：在页面加载后，video已经在自动播放模式下开始播放（即使它已隐藏），但我希望在点击预览图像后立即启动自动播放…

这是我的代码：

  $(window).load(function(){ $(".video").hide(); $(".loader").click(function(){ $(this).hide(); $(this).parent().find(".video").show(); }); }); 

  #container .post .postimg img{ width:100%; height:auto; } #container .post .postvideo{ position:relative; display:block; width:100%; height:430px; background-color:#0F3; } #container .post .postvideo .con{ position:absolute; top:0; left:0; height:100%; width:100%; z-index:1; } #container .post .postvideo .video{ background-color:#C00; } #container .post .postvideo .video iframe{ width:100%; height:100%; } #container .post .postvideo .loader{ background-color:#06C; } #container .post .postvideo .loader img{ width:100%; height:100%; } 

Answer 1

你需要使用，

YouTube JavaScript播放器API

或者，

把它作为url（ autoplay off ）

 http://www.youtube.com/embed/v_MVwUqrwDc?rel=0&autoplay=0" 

点击按钮将src更改为

 http://www.youtube.com/embed/v_MVwUqrwDc?rel=0&autoplay=1" 

这不会像js api一样顺利，但会做到这一点。

Answer 2

如果您不想使用youtube API或vimeo API，我建议您将iframe src清空并在单击加载器div时设置它。 所以

我会用的

和

然后在js代码的click事件中，只需将data-iframe-src值设置为iframe src：

 $(this).parent().find(".video iframe").attr("src", $(this).attr("data-iframe-src"));