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();
});

猜你喜欢

转载自www.cnblogs.com/hr-cmbc/p/12509270.html