HTML and CSS Reference
If you set both width and height to an aspect ratio that doesn't
match that of the video, the video is not stretched to those
dimensions but is rendered “letter-boxed” inside the video ele-
ment of your specifi ed size while retaining the aspect ratio.
The loop attribute is another Boolean attribute. As you would
imagine, it loops the media playback.
Maybe you're pretty sure that the user wants to activate the
media (he's drilled down to it from some navigation, for example,
or it's the only reason to be on the page), but you don't want to
use autoplay . If so, you can suggest that the browser preload
the video so that it begins buffering when the page loads in the
expectation that the user will activate the controls.
<video src=leverage-a-synergy.ogv controls preload>
There are three spec-defi ned states of the preload attribute. If
you just say preload , the user agent can decide what to do. A
mobile browser may, for example, default to not preloading until
explicitly told to do so by the user.
1. preload=auto (or just preload )
A suggestion to the browser that it should begin downloading
the entire fi le. Note that we say “suggestion.” The browser may
ignore this—perhaps because it detected very slow connection
or a setting in a mobile browser “Never preload media” to save
the user's bandwidth.
This state suggests to the browser that it shouldn't preload the
resource until the user activates the controls.
This state suggests to the browser that it should just prefetch
metadata (dimensions, fi rst frame, track list, duration, and so
on) but that it shouldn't download anything further until the user
activates the controls.
NOTE The specification for
preload changed in March
2010 and is not implemented any-
where as of April 2010.