HTML and CSS Reference
In-Depth Information
autoplay
: A Boolean attribute that, when present, instructs the browser to automatically begin
playing the audio when the page loads.
mediagroup
: Can associate multiple media elements (both
audio
and
video
) with a single
media controller object, allowing multiple sources to be synchronized. For example, a video could
be synchronized with a separate audio commentary track. The attribute's value is any name you
wish to give to the media group, and all media elements in the group should share the same
name in their own
mediagroup
attributes.
loop
: A Boolean attribute that, when present, instructs the browser to automatically repeat
playback from the beginning each time the audio reaches the end, looping forever until you tell it
to stop.
muted
: A Boolean attribute that, when present, indicates that the audio defaults to a muted state
when it loads.
crossorigin
: Cross-Origin Resource Sharing (CORS) settings, specifying that the video file or
stream may or may not be served from other domains. This attribute can only have the values
anonymous
(the default) or
use-credentials
. The attribute with an empty value is equivalent to
anonymous
. The
crossorigin
attribute is most useful on secure websites. For more on CORS,
see
w3.org/TR/cors
.
video
The
video
element embeds a digital video in a web page, and is very similar to the
audio
element, with
many of the same optional attributes. As with
audio
, the
video
element can include the URL of the video
file or stream in a
src
attribute, assuming there's only a single source:
<video src="video/feature.mp4" controls></video>
As with
audio
, the
controls
attribute invokes the browser's native control bar, which tends to look the
same as each browser's audio controls (Figure 5-10 is taken from Chrome). The
video
element also has a
similar set of JavaScript methods, so you can build your own custom control bar if the browser's native
controls don't suit you.
Figure 5-10.
An embedded video showing Chrome's built-in controls
