Question

我的原始html5视频存在问题，我想通过从视频帧中获取poster进行自定义。所以我决定我的所有视频都会排队参数#t=1，告诉浏览器从第二个1开始播放视频。通过这种方式，我可以在我的视频中使用poster而不是黑色背景。但我有一个问题，简化如下...使用以下JQuery code我告诉浏览器重新初始化第二个0而不是第二个1的视频，这个因为我的视频#t=1。所以使用这个JQuery code我部分地解决了这个问题，因为我有视频poster，视频虽然设置为在第二个1从第二个0开始后开始但在这里出现问题，用户点击视频，暂停但始终从第二个0开始，但我宁愿在用户暂停视频的情况下，这是从它被中断的点开始而不是从最开始。

这是我的伪代码......

$(document).ready(function() {
  var video = $("video")[0];
  // video starting from #t=1 now play from #t=0
  $("video").on("play", function() {
    this.currentTime = 0;
  });
  // pseudo code...
  if pause video then continue from interruption
});

感谢每一个建议。谢谢。

＆＃13;

$(document).ready(function() {
  var video = $("video")[0];
  $("video").on("play", function() {
    this.currentTime = 0;
   }); 
});

＆＃13;

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div class="video-html5" style="float: left; margin: 0 5px 5px 0"><video width="560" height="315" controls preload="metadata"><source src="https://archive.org/download/ElephantsDream/ed_1024_512kb.mp4#t=1" type="video/mp4"></video></div>

＆＃13;

Answer 1

$("video").one(可以解决您的问题，但我同意评论者的意见，您最好直接使用poster属性，而不要使用此 hack

$(document).ready(function() {
  $("video").one("play", function() {
    this.currentTime = 0;
   }); 
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<div class="video-html5" style="float: left; margin: 0 5px 5px 0"><video width="560" height="315" controls preload="metadata"><source src="https://archive.org/download/ElephantsDream/ed_1024_512kb.mp4#t=1" type="video/mp4"></video></div>

JQuery从第二个零开始播放html5视频，但如果用户暂停视频，则保留当前帧

1 个答案: