HTML and CSS Reference
In-Depth Information
the standard code. The solution (located in the student files Chapter11/music.html
folder) is shown below.
<object data="soundloop.mp3" height="50" width="100"
<param name="src" value="soundloop.mp3" />
<param name="controller" value="true" />
<param name="autoplay" value="false" />
<!--[if !IE]>-->
<object data="soundloop.mp3" height="50" width="100"
type="audio/mpeg" >
<param name="src" value="soundloop.mp3" />
<param name="controller" value=“true" />
<param name="autoplay" value="false" />
Browsers render in a top-down line-by-line fashion. Only Internet Explorer understands
the conditional comments. In this case, the conditional comment indicates that Internet
Explorer should ignore the code within the comments. The conditional comment begins
with <!--[if !IE]>--> and ends with <!--<![endif] --> . So, Internet Explorer
will render the first <object> tag and skip the second, while other browsers will
process one after another (within the same area in the browser viewport) and render
using the code from the second <object> tag. If this sounds complicated—it is! Life
would be so much less complex if browsers behaved in a more similar manner. You'll
get some experience with the <object> tag in the next Hands-On Practice.
In this Hands-On Practice you will create a Web page that displays a controller to play
a sound (see Figure 11.3). If you have not done so already, copy the music.mp3 or
music2.mp3 sound file from the Chapter11 folder in the student files and save it to
disk. Launch Notepad or another text editor and create a Web page that contains the
heading Playing Sounds with the Object Tag and uses the <object> tag and <param />
tag to display a console that lets the Web page visitor control the audio file. Use the
sample code above and the list of attributes and values in Table 11.1 and Table 11.2 as
a guide. Experiment with the <object> element's width attribute—try the values 25,
50, 100, and 110 and notice how the display of the controller changes. Explore the
<param /> element's autoplay value to configure the sound to automatically play
when the page loads. Use the <param /> element's loop value to cause the sound to
loop continuously. Save your page as object.html and test it in a browser. Try to test
your page in different browsers and browser versions. Compare your work to the sam-
ple in the student files (Chapter11/object.html).
Search WWH ::

Custom Search