Change the video playback speed using video.js

问题

Is there any existing plugin to change the playback rate of a video using the video.js player? If not, how can I add the new plugin and the new control button for the same?

Thanks in advance.

回答1:

I've the same issue. I just found that:

videojs('my-player', {
  playbackRates: [0.5, 1, 1.5, 2]
});

see videojs docs

回答2:

From videojs v.4.6.0 on there is a JSON parameter for data-setup that you can pass to add the playback speed option to the videoplayer:

<video id="my_video_1" class="video-js vjs-default-skin" controls 
preload="auto" width="640" height="268" 
data-setup='{ "playbackRates": [0.5, 1, 1.5, 2] }'>

Demo: http://jsbin.com/vikun/1/edit?html,output

Credits: https://stackoverflow.com/a/24767026/1066234

Note: You must use double quotes for the parameters within data-setup.

Helpful: If you need to change the speed after the videoplayer is ready (Jquery), use:

var video = videojs('videoplay', options);

video.ready(function() {
    // faster speed initially
    this.playbackRate(1.5);
});

回答3:

var player = videojs('videoplay');
player.ready(function() {
   var _this = this
   var playbackRate = $("#playbackRate").val();
   var speed = parseFloat(playbackRate);

   var volume = parseFloat($("#volume").val()/100.0); //[0,100]

   setTimeout(function() {
       _this.playbackRate(speed);
       _this.volume(volume); //work for audio
   },20);
});
player.src('/media/'+data.uuid+'.m3u8');
player.play();

above code works for me in production env, it's really hard to understand why should we delay for a moment before play audio stream.

来源：https://stackoverflow.com/questions/19112255/change-the-video-playback-speed-using-video-js

标签

html5-video

video.js