1
00:00:00,450 --> 00:00:07,010
To embed video in an HMO five document we can use the video element inside the element.

2
00:00:07,070 --> 00:00:10,830
We can set various attributes first.

3
00:00:10,870 --> 00:00:14,920
We can set the width and height using fixed dimensions or percentage

4
00:00:18,310 --> 00:00:19,210
in this example.

5
00:00:19,210 --> 00:00:26,580
We have the width set of six hundred pixels so you can see that the video with stays at six hundred

6
00:00:26,580 --> 00:00:30,510
pixels regardless of the browser window size

7
00:00:33,790 --> 00:00:35,470
if we set it to 100 percent

8
00:00:40,670 --> 00:00:49,840
the video will take up the full content area of the web browser.

9
00:00:54,940 --> 00:01:01,510
We can use the controls attribute to specify if we want the user to be able to see the control menu.

10
00:01:01,610 --> 00:01:11,200
This includes the play button the progress bar the volume and full screen controller if you do not want

11
00:01:11,200 --> 00:01:12,050
the controls.

12
00:01:12,070 --> 00:01:14,140
Simply remove the controls attribute

13
00:01:18,120 --> 00:01:23,460
after receiving the file you can see that the controller is no longer there.

14
00:01:26,300 --> 00:01:28,850
Remember to add an auto play attribute

15
00:01:31,670 --> 00:01:32,990
if you remove the controls.

16
00:01:33,410 --> 00:01:41,210
Otherwise the video will not play automatically in your user will have no way to play the video or save

17
00:01:41,210 --> 00:01:45,340
the following refresh and you can see that the video now starts automatically.

18
00:01:51,220 --> 00:01:56,050
The auto play attribute does not work in mobile devices like iPods and iPhones.

19
00:01:56,110 --> 00:01:57,580
So that is something to keep in mind.

20
00:02:00,220 --> 00:02:03,750
The video element requires that we specify the source of the video.

21
00:02:04,580 --> 00:02:10,220
We've included a demo video you can use in the downloads folder corresponding to this lesson.

22
00:02:10,330 --> 00:02:15,520
Just make sure that you place the video in the same directory that you've saved this HMO file into

23
00:02:18,310 --> 00:02:20,730
the video is titled Why a dot.

24
00:02:20,740 --> 00:02:21,460
MP for

25
00:02:25,080 --> 00:02:33,300
next to this source we've specified the video type and underneath the source tag it's a good idea to

26
00:02:33,300 --> 00:02:38,070
notify the user if their browser does not support the video tag.

27
00:02:38,700 --> 00:02:46,810
That way you will know to update their browser and lastly close the video tag and so as you can see

28
00:02:46,810 --> 00:02:48,730
it's very easy to work with this element.