javascript - popcorn.js 可以检测切换视频并继续而不重新启动吗?

标签 javascript video popcornjs

我正在制作交互式视频,并且刚刚开始使用 popcorn.js 我有一个视频,在视频中的某个点上有 2 个按钮可以转到另一个视频。我的问题是,我创建的在第一个视频中的某个时间弹出的所有文本也会在其他视频中弹出。

这是第一个视频:

<video id="main-video" src="DSC_0010_1.mp4" video muted></video>

这是爆米花部分:

document.addEventListener("DOMContentLoaded", function () {

     var pop = Popcorn("#main-video");

     pop.footnote({
       start: 2,
       end: 15,
       text: "<br>Dobrodošel popotnik, <br> na kratko bi ti rad predstavil mesto Ptuj...",
       target: "video-text"
     });

     pop.play();
  }, false);

以下是切换到其他视频的部分:

function vidSwap(vidURL) {
  var myVideo = document.getElementsByTagName('video')[0];
  myVideo.src = vidURL;
  myVideo.load();
  myVideo.play();
}

这是其中一个按钮:

<button class="gumb-podlaga" href="#" onClick="javascript:vidSwap('dominikanski-mesto.mp4'); return false;">Staro mestno jedro</button>

我正在寻找答案,是否有任何解决方案,爆米花可以检测到切换视频源并不意味着从头开始。

最佳答案

尝试在加载视频之前记录时间,然后在播放之前进行设置:

function vidSwap(vidURL) {
  var myVideo = document.getElementsByTagName('video')[0];
  var currentTime = myVideo.currentTime;
  myVideo.src = vidURL;
  myVideo.load();
  myVideo.currentTime = currentTime;
  myVideo.play();
}

关于javascript - popcorn.js 可以检测切换视频并继续而不重新启动吗?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40629862/

相关文章:

css - 如何使用视频标签在html中播放不同格式的视频

javascript - 添加带有爆米花 TTML 字幕的视频元素

javascript - 如何更新 nodejs 中的全部或大部分 JSON 值?

javascript - 移动设备上谷歌地图的触摸事件

javascript - 重新编码fly-out menu函数使parent LI的 "sticky"

node.js - 在 Windows 上安装爆米花机开发人员

javascript - 如何使用 JavaScript 测试和计算动态编号的类名

video - youtube api v3 从 channel 中获取比视频更新的所有视频

iphone - 视频混音器API?