3

According to this site, this is supported in the playbackRate and defaultPlaybackRate attributes, accessible via the DOM. But this is not working on mobile. Example:

<!DOCTYPE html>

<video id="my-video" src="chubby-bubbies.ogv" ...></video>

<script type="text/javascript">
  /* play video twice as fast */
  document.getElementById("my-video").defaultPlaybackRate = 2.0;
  document.getElementById("my-video").play();

  /* now play three times as fast just for the heck of it */
  document.getElementById("my-video").playbackRate = 3.0;
</script>

The above works on Chrome, and also Firefox 20 and above on desktop.

Rajesh Kanna
  • 75
  • 1
  • 1
  • 8
  • I think it has to do with restrictions regarding html video on mobile. You can't control a video element until the user has hit play on said video. You can't force the video to start playing either through JS. – mattdevio Feb 14 '16 at 06:53

1 Answers1

2

The answer is simply that Mobile Chrome (Android) doesn’t support playbackRate changes even tho this website says it does: https://developer.mozilla.org/en/docs/Web/API/HTMLMediaElement#AutoCompatibilityTable

This is the real browser supported by playbackRate changes on mobile:

  • Chrome 20+ ✔
  • Firefox 20+ ✔
  • IE 9+ ✔
  • Safari 6+ ✔
  • Opera 15+ ✔
  • Mobile Chrome (Android) ✖
  • Mobile Firefox 24+ ✔
  • IE Mobile ✖
  • Mobile Safari 6+ (iOS) ✔
  • Opera Mobile ✖

I created a website and tested it by first adding the following to the web.config-file:

<system.webServer>
    <staticContent>
           <mimeMap fileExtension=".mp4" mimeType="video/mp4"/>
    </staticContent>
</system.webServer>

Then I uploaded a simple video to my website and uploaded it to Azure for testing in the different browsers: http://pandasneezy.azurewebsites.net/

I suggest you use Mobile Firefox 24+, and it should work just fine with : document.getElementById("my-video").playbackRate = 3.0;

Tobias Kullblikk
  • 226
  • 1
  • 12