The Essential Guide to HTML5

ROCK, PAPER, SCISSORS

Caution: The order of the audio file references should not be important, but I found warnings that
Firefox will not work if MP3 is listed first. That is, it won't go on to try and work with another file.

The

element. The loop attribute specifies looping, that is, repeating the clip. The controls attribute
puts controls on the screen. This may be a good thing to do because the clips can be very loud. In order to
make the audio a surprise, though, and to not add clutter to the visual presentation, I chose not to do this.

Heres a simple example for you to try. You will need to download sword.mp3 from the books download
page at http://www.friendsofed.com or find your own audio file and reference it by name here. If you open the
following HTML in Chrome

Audio example

youll see whats shown in Figure 8-8.

Figure 8-8. Audio tag with controls

Remember: for our game, we will play audio for the rock crushing the scissors, the paper covering the
rock, the scissors cutting the paper, and a sigh for any tie. Here is the coding for the four audio clips in
rock-paper-scissors:

The Essential Guide to HTML5

ROCK, PAPER, SCISSORS

Get our desktop app

Company

Features

Documentation

Resources