html5 video视频倍速播放问题

html5 video视频倍速播放

使用playbackRate属性可读写控制音视频播放速率

// 获取视频速率

var playback = video.playbackRate;

// 设置视频播放速率

video.playbackRate = 1.5;

// 获取音频播放速率

var audioPlay = audio.playbackRate;

// 设置音频播放速率

audio.playbackRate = 1.5;

示例代码如下：

  <video id="video" width="180" height="314" autobuffer controls src="视频地址.mp4" type="video/mp4"></video>

　　　　<p>请选择播放速率：

　　　　　　<select id="rate">

    　　　　<option value="0.5">0.5</option>

    　　　　<option value="1" selected>1.0</option>

    　　　　<option value="1.25">1.25</option>

    　　　　<option value="1.5">1.5</option>

    　　　　<option value="2">2.0</option>

　　　　　　</select></p>

<p><button id="play">视频播放</button></p>

var sel = document.getElementById('rate');

var btn = document.getElementById('play');

var video = document.getElementById('video');

sel.addEventListener('change', function () {

    video.playbackRate = this.value;

});

btn.addEventListener('click', function () {

    video.play();

});