HTML 5 Videos--Video elements

The video element supports three different formats	IE	Firefox	Opera	Chrome	Safari
Ogg file with Theora video encoding and Vorbis audio encoding	No	3.5+	10.5+	5.0+	No
MPEG 4 files with H + video encoding and AAC audio encoding	9.0+	No	No	5.0+	3.0+
WebM file with VP8 video encoding and Vorbis audio encoding	No	4.0+	10.6+	6.0+	No

1. Set up a file in ogg format

<video src= "Movie.ogg" controls= "Controls" height= "200px" width= "300px" >
Your browser does not support the video tag.
</video>

EXECUTE as follows:

When the browser does not support Ogg format, it displays "Your browser does not support video tags." ”

2. Set multiple formats
<video width= "height=" poster= "Suk.png" controls>
<source src= "Movie.mp4" type= "Video/mp4" >
<source src= "Movie.ogg" type= "Video/ogg" >
Your browser does not support the video tag.
</video>

EXECUTE as follows:

If you set a default picture for your video. You can also add additional properties.

The properties of the <video> tag are as follows:

Controls/controls= "Controls" show play button
Autoplay/autoplay= "AutoPlay" Play Now
Loop/loop= "loop" loop playback
muted/muted= "Muted" mute
preload/preload= "preload" load video D
poster= "path" displays the default picture

3. Custom Play pause and size (Video + DOM)

<button onclick= "Playpause ()" > Play/Pause </button>
<button onclick= "Makenormal ()" > Change size </button>

<video id= "video1" width= ">"
<source src= "Movie.mp4" type= "Video/mp4" >
<source src= "Movie.ogg" type= "Video/ogg" >
Your browser does not support the video tag.
</video>

Write JavaScript underneath the HTML

<script type= "Text/javascript" >
var Myvideo=document.getelementbyid ("Video1");

function Playpause ()
{
I f (myvideo.paused)
Myvideo.play (); Play
Else
Myvideo.pause (); Time out
}

function Makenormal ()
{
myvideo.width=420; Custom width, highly adaptive
}
</script>

EXECUTE as follows:

Most browsers support video methods, properties, and events (to be understood later)

Method	Properties	Events
Play ()	Currentsrc	Play
Pause ()	CurrentTime	Pause
Load ()	Videowidth immediate execution-video element before execution	Progress
Canplaytype ()	Videoheight immediate execution-video element before execution	Error
	Duration	Timeupdate
	Ended	Ended
	Error	Abort
	Paused	Empty
	Muted	Emptied
	Seeking	Waiting
	Volume	Loadedmetadata
	Height
	Width

Below is the method properties and event reference for HTML5 video and audio

Http://www.w3school.com.cn/tags/html_ref_audio_video_dom.asp

HTML 5 Videos--Video elements