[HTML/Web] HTML5之`<Video>`元素

概述：video 元素

核心属性：playbackRate/播放速率

  • 在HTML5中，<video> 元素提供了一个 playbackRate 属性，可以用来设置视频的播放速度。

这个属性允许你设置视频的倍速播放，比如正常速度、慢速或快速。

  • 以下是如何设置 <video> 元素的倍速播放：
  • html
<video id="myVideo" width="320" height="240" controls>
  <source src="movie.mp4" type="video/mp4">
  Your browser does not support the video tag.
</video>
  • javascript
// 获取video元素
var video = document.getElementById("myVideo");

// 设置播放速度为2倍速
video.playbackRate = 2.0;
  • 你可以通过修改 playbackRate 的值来控制播放速度：
  • playbackRate = 1.0 : 表示正常速度。
  • playbackRate > 1.0 : 表示加速播放（例如，2.0 表示两倍速度）。
  • playbackRate < 1.0 : 表示减速播放（例如，0.5 表示一半速度）。

请注意，不是所有的浏览器都支持所有可能的播放速度，而且有些浏览器可能对 playbackRate 的支持有限。
因此，在使用时需要考虑到浏览器的兼容性问题。

X 参考文献

  • Kimi GPT : html5中video元素如何设置倍速播放?
  • W3CSchool.com.cn
posted @ 2024-12-21 15:37  千千寰宇  阅读(296)  评论(0)    收藏  举报