ptg16476052
Embedding Video Using <video> 397
14
The tag is new in HTML5. It embeds a video within a web page and uses the browser’s native video playback capabilities to do it, as opposed to Flash or some other plug-in. Here’s a simple vers ion of the tag:
If the browser is capable of playing the video at the URL specified in the src attribute, it will do so. Or, it would, if there were some way of telling the browser to play the video. In this case, the video will have no controls and won’t start playing automatically. To take care of that, I need to use some of the attributes of the tag, whi ch are listed in Table 14.1.
TABLE 14.1 Attributes
Attribute Description
src The URL for the video to be played.
height The height of the element.
width The width of the element.
controls Boolean attribute that indicates that the browser should supply its own controls for the video. The default is to leave out the controls.
autoplay Boolean attribute that indicates that the video should play immediately when the page loads.
loop Boolean attribute. If present, the video will loop when it reaches the end, replaying until the user manually stops the video from playing.
preload Boolean attribute. If present, the browser will begin downloading the video as soon as the page loads to get it ready to play. Ignored if autoplay is present.
poster Image to show prior to starting playback.
muted Boolean attribute. If present, the video will have no sound.
Because the video above doesn’t have the controls or autoplay attributes, there’s no way to get it to play. Figure 14.8 shows the video, embedded using the following tag, with controls in cluded:
