WEB DEVELOPER SITE
HTMLCSSJAVASCRIPTSQLPHPBOOTSTRAPJQUERYANGULARXML
 

HTML5 SVG


There are many ways to play video in HTML.

HTML Video Example. Simple Video Clip .

Try it yourself »


Playing Videos in HTML

Playing videos in HTML is not easy!

You need to master a lot of skills to ensure that your video files can be played in all browsers (Internet Explorer, Chrome, Firefox, Safari, Opera) and all hardware (PC, Mac, iPad, iPhone).

In this chapter, the rookie tutorial summarizes the problems and solutions for you.


Browser Support

The numbers in the table determine the principal program form that completely underpins the <video> element.

Element
<video> 4.0 9.0 3.5 4.0 10.5

The HTML <video> Element

To demonstrate a video in HTML, use the <video> element:

Example

<video width="320" height="240" controls>
  <source src="YouTube_15.mp4" type="video/mp4">
  <source src="YouTube_15.mp4" type="video/ogg">
Your program does not bolster the video tag.
</video>
Try it yourself »

How it Works

The controls property are extremely valuable in video you can includes controls like play interruption and volume.

It is anything but difficult to incorporate both width and stature attributes.

It is mandatory set tallness and width , If you are not set program does not know size of video.

Text between the <video> and </video> labels will just show in programs that don't support the <video> element.

Multiple <source> components can connection to various video records. First The program will utilize perceived format.


HTML <video> Autoplay

HTML5 <video>The tag defines a video or movie.

<video>Elements are supported in all modern browsers.

The following HTML snippet shows a video in ogg, mp4, or webm format embedded on a web page:

Example

<video width="320" height="240" autoplay>
  <source src="YouTube_15.mp4" type="video/mp4">
  <source src="YouTube_15.mp4" type="video/ogg">
Your program does not bolster the video tag.
</video>
Try it yourself »

HTML Video - Browser Support

The following examples use 4 different video formats. HTML 5 <video> The element attempts to play the video in one of mp4, ogg, or webm formats. If all fails, fall back to <embed>element.

Browser MP4 WebM Ogg
Internet Explorer YES NO NO
Chrome YES YES YES
Firefox YES YES YES
Safari YES NO NO
Opera YES (from Opera 25) YES YES

HTML Video - Media Types

File Format Media Type
MP4 video/mp4
WebM video/webm
Ogg video/ogg

HTML Video - Methods, Properties, and Events

HTML5 incorporate DOM strategies, properties, and occasions for the <video> element.

This enables you to load, play, and delay recordings, just as setting span and volume.

DOM occasions that can advise you when a video starts to play, is delayed, etc.

Example: Using JavaScript




This is Simple Video Clip .

Try it yourself »

For a full DOM reference, go to our HTML5 Audio/Video DOM Reference.