Latest web development tutorials

HTML Audio / Video DOM durationchange event

HTML audio / video Tag Reference HTML Audio / Video DOM Reference

Examples

Tip duration of the video has changed:

myVid=document.getElementById("video1");
myVid.ondurationchange=alert("The video duration has changed");

try it"

Definition and Usage

When you specify the audio / video length of time the data changes, durationchange event occurs.

When the audio / video is loaded, the length will be "NaN" into the audio / video of the actual length of time.

When the audio / video is loading process will be followed by the following events occur:

  1. loadstart
  2. durationchange
  3. loadedmetadata
  4. loadeddata
  5. progress
  6. canplay
  7. canplaythrough

Browser Support

Internet ExplorerFirefoxOperaGoogle ChromeSafari

All major browsers support durationchange event.

Note: 8 and earlier versions of Internet Explorer does not support the event.


grammar

In HTML:

<audio|video ondurationchange=" SomeJavaScriptCode ">

In JavaScript:

audio|video .ondurationchange= SomeJavaScriptCode ;

Use addEventListener ():

audio|video .addEventListener("durationchange", function()
{
//SomeJavaScriptCode
}
);

technical details

以下 HTML 标签支持: <audio>, <video>
以下 JavaScript 对象支持: Audio, Video


Examples

More examples

Use ondurationchange attributes on HTML elements

Use addEventListener () to listen for the event durationchange


HTML audio / video Tag Reference HTML Audio / Video DOM Reference