HTML5 Video + DOM

HTML5 <video> - Take Control Using the DOM

The HTML5 <video> element also has methods, properties, and events.

There are methods for playing, pausing, and loading, for example. There are properties (e.g. duration, volume, seeking) that you can read or set. There are also DOM events that can notify you, for example, when the <video> element begins to play, is paused, is ended, etc.

The examples below illustrate, in a simple way, how to address a <video> element, read and set properties, and call methods.

HTML5 <video> - Methods, Properties, and Events

The table below lists the video methods, properties, and events supported by most browsers:

Methods	Properties	Events
play()	currentSrc	play
pause()	currentTime	pause
load()	videoWidth	progress
canPlayType	videoHeight	error
	duration	timeupdate
	ended	ended
	error	abort
	paused	empty
	muted	emptied
	seeking	waiting
	volume	loadedmetadata
	height
	width

Note: Of the video properties, only videoWidth and videoHeight are immediately available. The other properties are available after the video's meta data has loaded.

Partner site : online news