Vimeo嵌入:自定义播放按钮正常工作。如何添加暂停按钮?

时间:2020-04-29 13:13:07

标签: html wordpress iframe vimeo vimeo-api

我设法使用此代码通过外部播放按钮播放了vimeo视频

<div class="myvimeo_container">

<iframe id="vimeovid1" src="https://player.vimeo.com/video/vimeoID" width="854" height="480" frameborder="0" allowfullscreen="allowfullscreen"></iframe>
<br>
<button onclick="play_video()">MY_PLAY_BUTTON</button>

<script>
function play_video() {
  var player = document.getElementById("vimeovid1");
  var data = { method: "play" };
  player.contentWindow.postMessage(JSON.stringify(data), "*");
}
</script></div>

这正在工作!

但是我很难添加第二个按钮来暂停视频。 有没有办法实现第二个

<button onclick="pause_video()">MY_PAUSE_BUTTON</button>

<script>
function play_video() {
  var player = document.getElementById("vimeovid1");
  var data = { method: "pause" };
  player.contentWindow.postMessage(JSON.stringify(data), "*");
}
</script>

我还不能弄清楚。我刚刚开始学习编码,如果有人能指出我正确的方向,那就太好了。

顺便说一下,我在wordpress中使用上面的代码...嵌入了一个vimeo视频...他们的响应式嵌入效果不是那么棒...所以我正在尝试一些解决方法...

1 个答案:

答案 0 :(得分:0)

请尝试将函数名称更改为pause_video,因为这是您的按钮试图调用的内容。