HTML DOM Video playbackRate Property

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 that represents the current playback speed.

Syntax:

It returns the Video playbackRate property.

videoObject.playbackRate

It is used to set the Video playbackRate property.

videoObject.playbackRate = playbackspeed

Property Values: It contains a single value playbackspeed which specifies the default playback speed of the video. The available options are:

1.0 is the normal speed.
0.5 is half speed.
2.0 is double speed.
-1.0 is backward, normal speed.
-0.5 is backward, half-speed.

Return Values: It returns a Number that represents the current playback speed

The below program illustrates the Video playbackRate property in HTML DOM:

Example: This example sets the video playing speed to double.

HTML

<!DOCTYPE html>
<html>
 
<head>
    <title>
        HTML DOM Video playbackRate Property
    </title>
</head>
 
<body style="text-align:center;">
    <h1 style="color:greenl">
        w3wiki
    </h1>
    <h2 style="font-family: Impact;">
        Video PlaybackRate Property
    </h2>
    <br>
    <video id="Test_Video" width="360"
           height="240" controls>
        <source src=
"https://media.w3wiki.net/wp-content/uploads/20230623154414/Untitled.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>
        let v = 
           document.getElementById("Test_Video");
        function My_VideoRate() {
            alert(v.playbackRate);
        }
        function Set_VideoRate() {
            v.playbackRate = 2;
        }
    </script>
</body>
 
</html>

Output:

Supported Browsers: The browser supported by Video playbackRate property are listed below:

Google Chrome 1 and above
Edge 12 and above
Internet Explorer 9.0 and above
Firefox 20 and above
Opera 12.1 and above
Apple Safari 3.1 and above

HTML

Contact Us