HTML 5 video, html video

HTML 5 video, html video

The video element supports three video formats.	IE	Firefox	Opera	Chrome	Safari
With Theora video encoding and Vorbis Audio EncodingOggFile	No	3.5 +	10.5 +	5.0 +	No
With H.264 video encoding and AAC audio encodingMPEG 4File	9.0 +	No	No	5.0 +	3.0 +
With VP8 video encoding and Vorbis Audio EncodingWebMFile	No	4.0 +	10.6 +	6.0 +	No

 

 

 

 

 

1. Set an ogg File

<Video src = "movie.ogg" controls = "controls" height = "200px" width = "300px">
Your browser does not support video tags.
</Video>

Run the following command:

If the browser does not support the ogg format, "your browser does not support video tags ."

2. Set multiple formats
<Video width = "320" height = "240" poster = "Suk.png" controls>
<Source src = "movie.mp4" type = "video/mp4">
<Source src = "movie.ogg" type = "video/ogg">
Your browser does not support video tags.
</Video>

Run the following command:

 

For example, set a default image for a video. You can also add other attributes.

<Video> the tag attributes are as follows:

Controls/controls = "controls" display play button
Autoplay/autoplay = "autoplay" play now
Loop/loop = "loop" loop playback
Muted/muted = "muted" mute
Preload/preload = "preload" load video d
Poster = "path" show default image

3. Custom pause and size (Video + DOM)

<Button onclick = "playPause ()"> play/pause </button>
<Button onclick = "makeNormal ()"> change the size </button>

<Video id = "video1" width = "200">
<Source src = "movie.mp4" type = "video/mp4">
<Source src = "movie.ogg" type = "video/ogg">
Your browser does not support video tags.
</Video>

Write javascript below html

<Script type = "text/javascript">
Var myVideo = document. getElementById ("video1 ");

Function playPause ()
{
I f (myVideo. paused)
MyVideo. play (); // play
Else
MyVideo. pause (); // pause
}

Function makeNormal ()
{
MyVideo. width = 420; // custom width, self-adaptive height
}
</Script>

Run the following command:

Video methods, attributes, and events supported by most browsers (to be understood later)

Method	Attribute	Event
Play ()	CurrentSrc	Play
Pause ()	CurrentTime	Pause
Load ()	VideoWidth: run immediately -- run before the video Element	SS
CanPlayType ()	VideoHeight: run immediately -- run before video Element	Error
	Duration	Timeupdate
	Ended	Ended
	Error	Abort
	Paused	Empty
	Muted	Emptied
	Seeking	Waiting
	Volume	Loadedmetadata
	Height
	Width

 

 

 

 

 

 

 

 

 

 

 

 

 

The following is a reference for html5 video and audio method attributes and events.

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