This page demonstrates the new HTML5 video
element, its media API, and the media events. Play, pause, and seek in the entire
video, change the volume, mute, change the playback rate (including
going into negative values). See the effect on the video and on the
underlying events and properties.
Media Events
loadstart
0
progress
0
suspend
0
abort
0
error
0
emptied
0
stalled
0
loadedmetadata
0
loadeddata
0
canplay
0
canplaythrough
0
playing
0
waiting
0
seeking
0
seeked
0
ended
0
durationchange
0
timeupdate
0
play
0
pause
0
ratechange
0
resize
0
volumechange
0
Media Properties
error
src
srcObject
currentSrc
https://media.w3.org/2010/05/sintel/trailer.mp4
crossOrigin
networkState
1
preload
none
buffered
[object TimeRanges]
readyState
0
seeking
false
currentTime
0
duration
NaN
paused
true
defaultPlaybackRate
1
playbackRate
1
played
[object TimeRanges]
seekable
[object TimeRanges]
ended
false
autoplay
false
loop
false
controls
true
volume
1
muted
false
defaultMuted
false
audioTracks
videoTracks
textTracks
[object TextTrackList]
width
0
height
0
videoWidth
0
videoHeight
0
poster
https://media.w3.org/2010/05/sintel/poster.png
canPlayType
video/mp4
video/webm
"maybe"
"maybe"
Tracks
Audio
Video
Text
?
?
?
Limitations
Some events may be fired despite the lack of effect on the video itself,
in particular while trying to change the playback rate;
Not all conditions are necessarily there to generate every single
possible event, such as stalled or emptied;
The rendered page may not be updated while the video is
playing. Thus you may see plenty of timeupdate
events counted after the video is paused/stopped;