Question

刚开始看看popcorn.js但遇到了一些麻烦。

我有30秒的曲目，

但是我希望文件从2秒开始播放，并在结束前3秒停止播放。

有人知道这是否可行，因为我在文档中找不到它？

或者是否有命令跳转到时间线中的某个点，所以几乎就像

pop.playAt('2 second');

类似的东西？

由于

Answer 1

这里有两个简单的步骤： 1）将视频推进到两秒钟 2）确保它在27秒（30 - 3）

停止

要推进视频，可以使用currentTime方法，但如果尝试在加载视频元数据之前设置currentTime，则会遇到错误。（当您第一次设置视频时，浏览器在获取标题之前不知道持续时间是什么，并且您不能在持续时间之后设置currentTime。）

var popcorn = Popcorn('#video');
if (popcorn.duration()) {
  popcorn.currentTime(2);
} else {
  popcorn.on('loadedmetadata', function() {
    popcorn.currentTime(2);
  }
}

现在，为了确保视频在27秒停止，您可以使用“cue”方法，该方法需要几秒钟的时间，并且当时会触发回调函数。

popcorn.cue(27, function() {
  popcorn.pause();
});

现在，默认情况下，Popcorn在从视频收到“timeupdate”事件时会触发事件，通常每1/4秒（250ms）。所以你可能会看到视频运行了几帧。（例如，它可能会在27.1秒停止）。如果您需要更高的准确度，请使用frameAnimation选项，这使爆米花尝试更新至60fps（每16ms）。

var popcorn = Popcorn('#video', {
  frameAnimation: true
});

您还可以通过告知浏览器仅向网络服务器询问您需要的视频部分来节省加载时间，方法是在网址中附加一个锚点形式的提示。

http://example.com/videos/myvideo.webm#t=2,27

这取决于浏览器和Web服务器的支持，但它不会受到伤害。

编辑：实际上，请不要在此处使用frameAnimation。问题是它使用requestAnimationFrame，如果您的浏览器选项卡不可见，则无法保证将调用它。它对动画有意义，但不是这里。我可能会在popcorn.js中提出修复方法。

popcorn.js开始和停止时间

1 个答案: