oncanplaythrough Event
Example
Execute a JavaScript when a video can be played all the way through, without stopping:
<video oncanplaythrough="myFunction()">
Try it Yourself »
More examples below.
Definition and Usage
The oncanplaythrough event occurs when the browser estimates it can play
through a media without having to stop for buffering.
Audio and Video Events
While loading a media, 7 events occur in the following order:
| Event | Occurs When | Bubbles |
|---|---|---|
| onloadstart | The loading of a media starts | No |
| ondurationchange | The duration of a media is changed | No |
| onloadedmetadata | The meta data for a media has been loaded | No |
| onloadeddata | A media frame is loaded | No |
| onprogress | The browser is loading a media | No |
| oncanplay | An element's scrollbar is being scrolled | No |
| oncanplaythrough | The browser estimates it can play a media | No |
Other events that can occur in the media loading process:
| Event | Occurs When | Bubbles |
|---|---|---|
| onabort | The loading of a media is aborted | No |
| onemptied | A media is empty (already loaded) | No |
| onerror | An error occurs while loading a media | No |
| onstalled | Media data is not available | No |
| onsuspend | The browser is not getting the media data | No |
See Also:
Syntax
In JavaScript, using the addEventListener() method:
object.addEventListener("canplaythrough", myScript);
Try it Yourself »
Technical Details
| Bubbles: | No |
|---|---|
| Cancelable: | No |
| Event type: | Event |
| Supported HTML tags: | <audio> and <video> |
| DOM Version: | Level 3 Events |
More Examples
Example
Execute a JavaScript when an audio can be played all the way through, without stopping:
<audio oncanplaythrough="myFunction()">
Try it Yourself »
Browser Support
oncanplaythrough is a DOM Level 3 (2004) feature.
It is fully supported in all browsers:
| Chrome | Edge | Firefox | Safari | Opera | IE |
| Yes | Yes | Yes | Yes | Yes | 9-11 |
