CODEWITHSUNDEEP
javascriptjqueryhtml5-video
MKK
MKK

Reputation: 2753

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

I'm coding like this for HTML5, and it's working fine. 

<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>

for JWplayer, how can I speed down/up playback speed just like above?

<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>

Upvotes: 0

Views: 2611

Answers (1)

tpeczek
tpeczek

Reputation: 24125

As described in this post JW Player support control over playback speed only when it is in html5 render mode and it that case you can control it through options of the video tag it renders. It would look like this:

<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>

There is not support in JW Player for playback speed control when the browser doesn't support it nativly through HTML5 (for example in case of using Flash player)

Upvotes: 1

Related Questions