Javascript DOM HTML Video defaultPlaybackRate Property set

Introduction

Set the video to slow motion by default: 

document.getElementById("myVideo").defaultPlaybackRate = 0.5;

View in separate window 

<!DOCTYPE html>
<html>
<body>

<video id="myVideo" width="100" height="100" controls>
  <source src="video.mp4" type="video/mp4">
  <source src="video.ogg" type="video/ogg">
  Your browser does not support the video tag.
</video><br>
<p id="demo"></p>
<button onclick="getPlaySpeed()" type="button">get is the default playback speed</button>
<button onclick="setPlaySpeed()" type="button">play in slow motion</button>

<script>
var x = document.getElementById("myVideo");

function getPlaySpeed() {//w  w  w.  j a v  a 2s.  c  o  m
  document.getElementById("demo").innerHTML = x.defaultPlaybackRate;
}

function setPlaySpeed() {
  x.defaultPlaybackRate = 0.5;
  x.load();
}
</script>

</body>
</html>

The defaultPlaybackRate property sets or gets the default playback speed of the video.

Setting this property will only change the default playback speed, not the current.

To change the current playback speed, use the playbackRate property.

Example values:

  • 1.0 is normal speed
  • 0.5 is half speed (slower)
  • 2.0 is double speed (faster)
  • -1.0 is backwards, normal speed
  • -0.5 is backwards, half speed

The value 0.0 is invalid and throws a NOT_SUPPORTED_ERR exception.

The defaultPlaybackRate property returns a Number representing the default playback speed.




PreviousNext

Related