Question

我想使用html5视频标签来播放我的视频。如何设置视频开始播放的时间。

例如我的视频是90秒，我想在30秒开始播放

  <video width="320" height="240" controls>
  <source src="<?php echo base_url() ?>/programs/prg1.mp4" type="video/mp4">
  Your browser does not support the video tag.
  </video>

请帮帮我

Answer 1

来自http://blog.grio.com/2012/08/how-to-seek-an-html5-video-at-a-specific-time-on-load.html

如何在Loadby Peter Tubig的特定时间寻找HTML5视频

HTML：

<video id="video1" width="320" height="240">
     <source src="movie.mp4" type="video/mp4" />
</video>

使用Javascript：

document.getElementById("video1").currentTime = 10;

Javascript语句将video1视频的当前时间设置为10秒标记。但是，这仅在浏览器已加载视频元数据时才有效。元数据包含相关的视频信息，例如尺寸和持续时间。知道视频的持续时间是浏览器搜索视频所必需的。如果没有，则不会设置当前时间（保持为0）。可能发生这种情况的一种情况是网页想要在页面加载的特定时间播放视频。

Answer 2

Html：

<video width="400" controls id="VideoId">
  <source src="Intro.mp4" type="video/mp4"> 
</video>`

JavaScript的：

var video = document.getElementsByTagName("VideoId")[0];
video.currentTime = 40.066667;

Answer 3

在html中

<video id="player" width="320" height="240" src="video1.ogv" type="video/ogg" controls="controls">
</video>

和java脚本：

<script language="javascript">
  var video1 = "video1.ogv";
  var video2 = "video2.ogv";
  var player = document.getElementById("player");
  player.setAttribute("ontimeupdate", "update();");
  var time = 0.0;
  var toUpdate = false;

  function changeVideo() {
    time = player.currentTime;
    if (player.src.match(video1+"$") == video1)
      player.src = video2;
    else
      player.src = video1;
    player.load();
    toUpdate = true;
    player.play();
  }

  function update() {
    if (flag) {
      player.currentTime = time;
      toUpdate = false;
    }
  }
</script>

如何使用html 5跳转到视频的位置

3 个答案: