Sams Teach Yourself HTML, CSS & JavaScript Web Publishing in One Hour a Day

(singke) #1
ptg16476052

416 LESSON 14: Integrating Multimedia: Video and Sound


Audio Player uses JavaScript to embed the player in a target element using a technique
similar to the SWFObject dynamic publishing technique. In the header of the page, I
included the JavaScript file provided with Audio Player and then set up the player in the
next <script> tag. Copy that code and replace the size with the size that works for you.
(The player in my example is set to be 325 pixels wide.)
Then in the body of the page, I included a <p> tag that will contain the player. My alter-
nate content goes inside the <p> tag. It’s replaced when the JavaScript that follows adds
the player to the page. In this case, I added a link that points to the MP3 file that the
player is going to play. Finally, I embedded the player using JavaScript. For it to work, I
specified the ID of the element that will contain the player and specified the location of
the audio file. In this case, it’s song.mp3, found in the same directory as the page.

Summary


In this lesson, you learned about the wide world of tags, codecs , and file formats associ-
ated with publishing audio and video on the Web. First, you learned how to upload your
video files to YouTube and publish them on your site. You also learned about some alter-
native sites, such as Vimeo , that provide video hosting. Then you learned about the file
formats associated with video on the Web and how to convert videos to those formats.
You learned a lot about the limitations of the various browsers in terms of the tags and
formats they support, and you discovered how to work around those limitations to deliver
your video and audio content to as many users as possible.
Next, I discussed the option of hosting your own videos. You learned how to embed
video in web pages using the <video> tag and the <object> tag and how to combine
them to support the largest number of browsers. You also learned about SWFObject, a
tool that makes it easier to embed Flash movies in your pages in a standards-compliant
way. The lesson also covered two Flash movies that can used to embed video or audio
files in your web pages. Finally, I discussed audio embedding and the <audio> tag.
Table 14.6 shows a summary of the tags you learned about in this lesson.

TABLE 14.6 Tags for Embedding Video and Audio
Tag Use
<audio> Embeds audio files into web pages for native playback by the
browser.
<embed> Embeds objects into web pages.
<object>...<object>Embeds objects into web pages.
Free download pdf