Training Guide: Programming in HTML5 with JavaScript and CSS3 Ebook

454 CHAPTER 11 HTML5 supports multimedia

border-style: groove;

width: 900px;

height: 600px;

margin-right: auto;

margin-left: auto;

text-align:center;

padding: 20px;

}

17. To know which source was selected by the browser (although this will be apparent
    when you play the video), add code to the default.js file to display the current source
    when the video is played.
    Your code should look like the following.
    ///
    $(document).ready(function () {
    $(‘#media').on(‘play', function () {
    $(‘#message').html($(‘#media')[0].currentSrc);
    });
    });


18. In Solution Explorer, right-click the VideoPage.html file and choose Set As Start Page.


19. Test your work by running the website by pressing F5.
    You should see the VideoPage.html page as shown in Figure 11-3.

FIGURE 11-3 he running video pageT