Can't get my code to work to play a sound when I click on an image

**12084182** · 04-30-2012, 02:10 AM

Hey all, was hoping I could get some help here, trying to get some sound to play when I click parts of an image. Here's some of my code, hopefully you can help me find out what's wrong

<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Virtual Drums</title>
<link href="wrapper.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
function playSound(soundobj) {
var thissound=document.getElementById(sound1);
thissound.Play();
}
</script>
</head>

<body>
<embed src="./MusicalNotes/sound1.wav" width=0 height=0
enablejavascript="true" autostart=false id="sound1">

<img src="Background_1.jpg" width="800" height="200" border="0" usemap="#Map" /> <img src="drum.jpg" width="800" height="600" border="0" usemap="#Map2" />
<map name="Map2" id="Map2">
<area shape="rect" coords="144,84,195,574" />
<form>
<input type="button" value="Play Sound1"
onClick="playSound1('sound1')">
</form>
<area shape="rect" coords="202,89,245,561" href="#" />
<area shape="rect" coords="254,90,297,514" href="#" />
<area shape="rect" coords="306,91,348,476" href="#" />
<area shape="rect" coords="359,93,396,427" href="#" />
<area shape="rect" coords="408,97,445,401" href="#" />
<area shape="rect" coords="455,98,484,372" href="#" />
<area shape="rect" coords="494,93,523,344" href="#" />
<area shape="rect" coords="534,98,563,316" href="#" />
<area shape="rect" coords="577,89,599,294" href="#" />
<area shape="poly" coords="610,91,608,286,632,285,636,93" href="#" />
<area shape="poly" coords="643,91,641,267,665,269,667,90" href="#" />
</map>
<map name="Map" id="Map">
<area shape="rect" coords="73,149,217,194" href="#" />
<area shape="rect" coords="238,152,419,196" href="#" />
<area shape="rect" coords="436,151,755,196" href="#" />
</map>

</body>
</html>
</div>

Thanks a lot for any help you may be able to give!

I placed an image of drums, and I made hotspots on the drums and I'd like that when I click each individual drum, a sound plays.

**xelawho** · 04-30-2012, 09:31 AM

have a look at your onclick...

Code:

<input type="button" value="Play Sound1" onClick="playSound1('sound1')">

it passes the string "sound1" to the function

the function receives it here

Code:

function playSound(soundobj) {
var thissound=document.getElementById(sound1);
thissound.Play();
}

and says right, soundobj now equals the string "sound1"

you then tell it to look for an element with an id equivalent to the variable sound1 (which doesn't exist) so it fails.

I suspect your function would look better like this:

Code:

function playSound(soundobj) {
var thissound=document.getElementById(soundobj);
thissound.Play();
}

Thread: Can't get my code to work to play a sound when I click on an image

Thread Tools

Display

Can't get my code to work to play a sound when I click on an image

Thread Information

Users Browsing this Thread

Bookmarks

Bookmarks

Posting Permissions