HTML | DOM Video playbackRate Property - GeeksforGeeks

18 Nov, 2021
The Video playbackRate property in HTML DOM is used to set or return the current playback speed of the video. The video playbackRate property returns a number which represents the current playback speed.
Syntax:
It returns the Video playbackRate property.videoObject.playbackRate
videoObject.playbackRate
It is used to set the Video playbackRate property.videoObject.playbackRate = playbackspeed
videoObject.playbackRate = playbackspeed
Property Values: It contains single value playbackspeed which specifies the default playback speed of the video. The available options are:
1.0 is normal speed.
0.5 is half speed.
2.0 is double speed.
-1.0 is backwards, normal speed.
-0.5 is backwards, half speed.
Return Values: It returns a Number that represents the current playback speed
Below program illustrates the Video playbackRate property in HTML DOM:
Example: This example sets the video playing speed to double.
<!DOCTYPE html><html>      <head>         <title>        HTML DOM Video playbackRate Property    </title></head>  <body style="text-align:center;">      <h1 style="color:greenl">        GeeksforGeeks    </h1>           <h2 style="font-family: Impact;">        Video PlaybackRate Property    </h2><br>          <video id="Test_Video" width="360" height="240" controls>        <source src="samplevideo.mp4" type="video/mp4">        <source src="movie.ogg" type="video/ogg">    </video>          <p>        For returning the playback speed of the video,        double click the "Return Playback Speed" button.    </p>          <button ondblclick="My_VideoRate()" type="button">        Return Playback Speed    </button>          <p>        For changing the playback speed of the video by default,        double click the "Change Playback Speed" button.    </p>          <button ondblclick="Set_VideoRate()" type="button">        Change Playback Speed    </button>          <script>        var v = document.getElementById("Test_Video");                  function My_VideoRate() {             alert(v.playbackRate);        }                   function Set_VideoRate() {             v.playbackRate = 2;        }     </script></body>  </html>                                                         
Output:
After loading the code:
Initial Playback Rate:
Updated Playback Rate:
Supported Browsers: The browser supported by Video playbackRate property are listed below:
Google Chrome
Internet Explorer 9.0/li>
Firefox
Opera
Apple Safari
Attention reader! Don’t stop learning now. Get hold of all the important HTML concepts with the Web Design for Beginners | HTML  course.
hritikbhatnagar2182
HTML-DOM
HTML
Web Technologies
HTML
Writing code in comment?
Please use ide.geeksforgeeks.org,
generate link and share the link here.
How to update Node.js and NPM to next version ?
REST API (Introduction)
How to Insert Form Data into Database using PHP ?
CSS to put icon inside an input element in a form
Types of CSS (Cascading Style Sheet)
Remove elements from a JavaScript Array
Installation of Node.js on Linux
Convert a string to an integer in JavaScript
How to fetch data from an API in ReactJS ?
Difference between var, let and const keywords in JavaScript