How to Change the Playing Speed of Videos in HTML5

How to change the playing speed of videos in HTML5?

According to this site, this is supported in the playbackRate and defaultPlaybackRate attributes, accessible via the DOM. Example:

/* play video twice as fast */
document.querySelector('video').defaultPlaybackRate = 2.0;
document.querySelector('video').play();

/* now play three times as fast just for the heck of it */
document.querySelector('video').playbackRate = 3.0;

The above works on Chrome 43+, Firefox 20+, IE 9+, Edge 12+.

Change multiple html5 video player speed

Change in Javscript file as:

<script type="text/javascript">
  /* play video twice as fast */
  document.querySelector('video').defaultPlaybackRate = 1.0;
  document.querySelector('video').play();

  /* now play three times as fast just for the heck of it */
  var videos =document.querySelectorAll('video');
  for (var i=0;i<videos.length;i++)
  {
    videos[i].playbackRate = 3.0;
  }
</script>

The mistake is as you use querySelector , it returns one video object.
As the querySelectorAll,returns the array of objects (as all video tag) .So you have to iterate the array and increase the speedrate of video.

Hope it may helps.
Happy Coding!!

How to change the playing speed of videos in HTML5 on mobile?

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;

How do I change the playback speed of the currently playing YouTube video, with JavaScript and the HTML5 player?

After playing around with the HTML, I just faked a .click(). That seems to be the best way. I poked around the YouTube API a bit but just found docs on embedding YouTube videos on your own page. I also played with HTML5 video like $('#video').playbackRate = 3.0 and you could then basically change the speed to whatever you wanted, but it wouldn't affect the dropdown box then, which can be useful if you want to change it back to another speed.

Here's the jQuery code:

$('#ytp-menu-speed').parent().find('.ytp-button:contains("1.5")').click()

Change 1.5 to whatever speed you want, as long as it's an option that YouTube provides.

How to disable HTML Video Player playback speed / three dots

According to the docs only three options are available (nodownload, nofullscreen, and noremoteplayback) and none seems to do what you want.

And you can't style the browser's default control set, but you can use the (JavaScript) Media API to build your own control set which of course you can style in any way that you like.
See this CodePen.

HTML5 increase youtube speed 2x from url?

There's no way to change playback speed by URL arguments.

Anyway, if you're working with HTML, you can take advantage of the YouTube Player iFrame API.

Here's how to configure your player with all the JavaScript:
https://developers.google.com/youtube/iframe_api_reference#Getting_Started

And here's the function you're looking for to set playback speed:
https://developers.google.com/youtube/iframe_api_reference#Playback_rate

So you can edit your onPlayerReady function like this:

function onPlayerReady(event) {
  player.setPlaybackRate(2); // This is what you're looking for
  event.target.playVideo();
}

You can of course pass on step 5 of the documentation as this will stop your video from playing after six seconds.

If you have trouble setting that up, I'll edit a JSFiddle later (couldn't do it at work as my Flash plugin won't launch).

Update :

Here's the JSFiddle working fine with this code exactly:
http://jsfiddle.net/jpreynat/e11oy0eu/