Question

Vimeo API文档让我在圈子中运行，我无法弄清楚该怎么做。

我想创建一个播放视频的简单按钮。有人可以提供一个简单的例子吗？它可能有助于我更好地理解此API的工作原理。

谢谢！

Answer 1

它可以更简单：这适用于我（页面上只有一个视频）

<iframe id="vid_id" 
        src="http://player.vimeo.com/video/123456789" 
        height="288" width="512" allowfullscreen>
</iframe>
<br>
<button onclick="play_video()">Button text</button>

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

在api=1的调用中似乎不需要player_id或player.vimeo.com。我在IE8，IE11，Fx，Chrome，Safari，Opera上测试过它。

（稍后编辑）：Android似乎是另一个故事;我一直无法在Android下找到任何程序控制的工作示例。我已通知Vimeo。

Answer 2

我认为Vimeo API文档也非常令人困惑，这就是我这样做的原因： http://labs.funkhausdesign.com/examples/vimeo/froogaloop2-api-basics.html

这是尽可能的骨头。

Answer 3

我想在不使用jquery或froogaloop的情况下添加这样的播放/暂停按钮。我不知道为什么，但是，当我不需要时，我讨厌包括一个图书馆。特别是对于像这样的简单事情。

以下是我提出的内容（我只是将其发布给正在搜索的其他人）：

<!DOCTYPE HTML>
<html>
<head>
    <title>Vimeo Test</title>
    <script language="JavaScript">
    var iFram, url;
    function startitup(){
        iFram = document.getElementById('theClip');
        url = iFram.src.split('?')[0];
    }
    function postIt(action, value) {
        var data = { method: action };
        if (value) {
            data.value = value;
        }
        if(url !== undefined){
            iFram.contentWindow.postMessage(JSON.stringify(data), url);
        }
    }
</script>
</head>
<body onload="startitup();">
<iframe id="theClip" src="http://player.vimeo.com/video/27855315?api=1" width="400"     height="225" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen>    </iframe>
<p><button onclick="postIt('play');">Play</button> <button     onclick="postIt('pause');">Pause</button></p>
</body>
</html>

Vimeo API：简单的播放按钮

3 个答案: