YouTip LogoYouTip

Av Event Ratechange

HTML Audio/Video DOM ratechange Event | Novice Tutorial

HTML Audio/Video DOM ratechange Event

The ratechange event is triggered when the playback rate of an audio/video changes (such as when the user switches to slow motion or fast forward mode).

Note: This event is invoked by the defaultPlaybackRate property or the playbackRate property of the Audio/Video object.

Browser Support

The numbers in the table indicate the first browser version that fully supports this event.

Event
ratechange Yes 9.0 Yes Yes Yes

Grammar

In HTML:

<audio|video onratechange="myScript">

In JavaScript:

audio|video.onratechange=function(){myScript};

In JavaScript, use the addEventListener() method:

audio|video.addEventListener("ratechange", myScript);

Note: The addEventListener() method is not supported in Internet Explorer 8 and earlier versions.

Technical Details

Supported HTML tags: <audio> and <video>
Supported JavaScript objects: Audio, Video

More Examples

The following example demonstrates how to use the onratechange event. When the user changes the video playback speed, the alert() function is triggered to display an alert box.

Video courtesy of Big Buck Bunny.

<video id="myVideo" width="320" height="176" controls> <source src="mov_bbb.mp4" type="video/mp4"> <source src="mov_bbb.ogg" type="video/ogg"> Your browser does not support HTML5 video. </video> <p>Video courtesy of <a href="http://www.bigbuckbunny.org/" target="_blank">Big Buck Bunny</a>.</p> <script> document.getElementById("myVideo").onratechange = function() {myFunction()}; function myFunction() { alert("The playback rate has changed"); } </script>

Try it Yourself Β»

Related Pages

HTML DOM Reference: ratechange Event

← Av Event SeekedAv Event Playing β†’