3

如何在图像单击时在引导模式窗口中自动播放 iframe 中的 Vimeo 视频？

我在使用 YouTube JavaScript API 之前已经这样做了，但不知道这如何与 Vimeo 一起使用。我看到他们也有一些 API，但可以使用一些指针来说明它是如何工作的。

首先尝试使用 jQuery 将 ?autoplay=1 附加到模态中的 iframe video src 属性，但没有奏效。

当模式在视频完成之前隐藏时，我还需要停止（）视频在后台运行。

任何指向正确方向的指针都非常有帮助！！！谢谢！

4

3 回答 3

4

我尝试使用 '?autoplay=1' 附加 iframe 的源代码，就像您提到的那样：

$("iframe")[0].src += "?autoplay=1";

似乎对我有用。我相信 iframe 还需要包含' allow="autoplay" '，例如：

<iframe src="YOURVIDEOURL" width="640" height="360" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen allow="autoplay">

要停止点击视频 - 我想附加 src，删除 '?autoplay=1' 然后也可以工作。

希望这对某人有帮助！

于 2018-12-04T16:12:12.723 回答
0

如果您熟悉 jQuery，我编写了一个插件，它可以简化使用标准 jQuery 表示法控制 Vimeo 视频。

https://github.com/jrue/Vimeo-jQuery-API

$("#yourvideo").play();
于 2014-06-24T01:21:00.700 回答
0

如果您尝试在单击图像时自动播放 vimeo 视频，那么这可能会有所帮助，我在单击图像时播放视频时遇到了同样的问题，但最终找到了这个解决方案。

<div id="modal-Id">
   <div id="parent-div">
     <img id="vimeo-videoId" src="images/your-image.png" onclick="return imgClick();" />
   </div>
</div>

 function imgClick() {
                jQuery('#your-imageId').hide();  //hide image to play the video
                var ifrm = document.createElement("iframe");
                ifrm.setAttribute("src", "https://player.vimeo.com/video/123456789?autoplay=1");
                ifrm.style.width = "496px";
                ifrm.style.height = "277px";
                // add rest of your values
                ifrm.frameborder = 0;
                document.getElementById("your-parent-Div").appendChild(ifrm);  //append it to your parent div 
                return false;
            }
于 2015-11-06T09:48:08.007 回答