HTML and CSS Reference
• Step 5: Provide multiple video formats to support all browsers.
As we mentioned, in this section you'll be making use of the HTMLMediaElement inter-
Step 1: Load a list of videos
First, let's hardcode a list of videos into the playlist and hook up everything so that when a
user clicks a video it starts playing. Listing8.3 shows the markup for the playlist; insert it in
certainly be generating this list dynamically, but we're going to avoid requiring backend
code in this chapter.
Listing 8.3. index.html—Markup for the video playlist
Step 2: Start a video when selected
In order to start a video when the user clicks one of the list items, you'll need to know one
property and one method of the HTMLMediaElement interface, both of which are summar-
ized in table 8.2 .
Table 8.2. HTMLMediaElement interface
Read/write, reflects the value of the src attribute; use it to select a new video.
Start playing the current media.