Multimedia: Video, Audio, and Embedded Media - HTML5 Mastery: Semantics, Standards, and Styling - page 210

sound. However, as you will see, these and other options are easy to add through the
various attributes available on the video element.
Adding video controls
To add control buttons to the video, all that's needed is to add the Boolean controls
attribute to video . Voila . The browser adds a basic but complete set of controls to the
video. An outward difference in HTML5 video that may be a bit of a shock to those used
to the consistency of appearance when using Adobe Flash is that the controls for a video
look different in each browser, since they are each implementing their own native video
player ( Figure 5-6 ) .
Figure 5-6. Appearance of the video element controls in different browsers: (L to R) Google
Chrome, Safari, Firefox, Opera
This difference in the appearance of the controls may be a bit of a disappointment if
you are design-minded at all, but it is important to remember that since the video is in
HTML, a custom set of controls can be created in CSS and JavaScript that provide a con-
sistent appearance across different browsers. That is a topic for another time, however
(we'll look at it again in Chapter 7 ).
Autoplaying and looping video
I mentioned the video will not automatically play when the page loads, but we can
change this by using the Boolean autoplay attribute. By adding this attribute…you
guessed it…the video begins playing immediately after it loads. Generally it's a bad idea
to include this attribute, unless your site works like YouTube or related sites where the
user would click a link and be taken to a video page. In such a site, the video is the focus
of the page, and the expectation is that the video will be played immediately.
Another Boolean attribute ( video has a lot of them) is the loop attribute, which
specifies that the video will replay when it has reached the end. Like automatically play-
ing the video, this is usually a good idea only in specific scenarios, such as if the video
is part of some sort of background ambience of the page.