HTML and CSS Reference
In-Depth Information
<video id="video"
poster="~/Media/BBB_Poster.png" width="852" height="480"
4.
Save your changes and press F5 to start the application. You should now see the
poster image until the video is started as shown in Figure
8-20
.
Figure 8-20.
The video element showing the poster image
Summary
In this chapter you created a simple web page that demonstrates the features of the
audio
and
video
elements.
Cross-browser support is achieved by supplying the media files in multiple formats so each browser can use the
one that it supports. This is pretty easy to do and fairly efficient since the browser can usually determine from the
markup which file to download.
I showed you how to create your own controls for playing, pausing, and seeking within your audio and
video files. By wiring up some simple JavaScript event handlers, making a custom media player becomes a
straightforward exercise.
In the next chapter I'll demonstrate how to take advantage of scalable vector graphics (SVG) in HTML5.
