如何使用javascript或jquery降低视频的播放速度

How can I decrease playback speed of the video using javascript or jquery?

本文关键字:视频 播放 速度 何使用 javascript jquery      更新时间:2023-09-26

我正在为HTML5编写这样的代码,它运行得很好。

<video id="video" controls="controls" autoplay="autoplay" name="media"><source src="http://media.w3.org/2010/05/sintel/trailer.mp4" type="video/mp4"></video>
<button onclick="document.getElementById('video').playbackRate+=0.1">playbackRate+=0.1</button>
<button onclick="document.getElementById('video').playbackRate-=0.1">playbackRate-=0.1</button><br>

对于JWplayer,我如何才能像上面一样降低/提高播放速度?

<script type="text/javascript">
    jwplayer("myElement").setup({
        file: "http://media.w3.org/2010/05/sintel/trailer.mp4",
        title: "test",
        height: 400,
        width: 600,
        autostart: true,
        autoplay: true,
    });
    jwplayer("myElement").onTime(function(time){
        showComments(Math.round(time.position));
    })
</script>

如本文所述,JW Player仅在处于html5渲染模式时才支持对播放速度的控制,在这种情况下,您可以通过它渲染的视频标签选项来控制它。它看起来是这样的:

<script type="text/javascript">
    function changePlaybackRate(rateChange) {
        if (jwplayer().getRenderingMode() == "html5") {
            var videoTag = document.querySelector('video');
            if (videoTag.playbackRate) {
                videoTag.playbackRate += rateChange;
            }
        }
        //Small hack to work around a Firefox bug    
        if(navigator.userAgent.toLowerCase().indexOf('firefox') > -1) {
            jwplayer().seek(jwplayer().getPosition());
        }
    };
</script>
<button onclick="changePlaybackRate(0.1)">playbackRate+=0.1</button>
<button onclick="changePlaybackRate(-0.1)">playbackRate-=0.1</button>

当浏览器不支持通过HTML5原生播放时,JW Player不支持播放速度控制(例如,在使用Flash播放器的情况下)