4 replies to this topic

[iConquest]

Hey :)

On my website, I've got a div at the bottom which is basically just an image that changes when you put your mouse over it:

Before mouseover:



On mouseover:



I want a sound to play when you click it.

I found a way to do this using javascript.

Here's the script:

<script language="javascript" type="text/javascript">

function playSound(soundfile) {

document.getElementById("dummy").innerHTML=

"<embed src=\""+soundfile+"\" hidden=\"true\" autostart=\"true\" loop=\"false\" />";

}

</script>

and here's the code for the images (including the mouseclick code to play the sound):

<span id="dummy" onclick="playSound('images/where.mp3');"><a onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Bottom-1','','images/dateover.png',1)"><img src="images/date.png" name="Bottom-1" width="115" height="45" border="0" id="Bottom-1"  /></a></span>

When I click the image, the sound plays but it also gets rid of the images:



This happens to everything that I try and use the sound on. For example, if I tried to click one word in <SPAN> tags, the sound would play but the word would disappear.

Is there a way to stop stuff disappearing when I want the sound to play?

Thanks.

[WingedPanther]

It looks like you're REPLACING the contents of the div tag with the sound tag. Try this (untested):

<script language="javascript" type="text/javascript">
function playSound(soundfile) {
document.getElementById("dummy").innerHTML=document.getElementById("dummy").innerHTML +
"<embed src=\""+soundfile+"\" hidden=\"true\" autostart=\"true\" loop=\"false\" />";
}
</script>

[iConquest]

It worked! Thanks a lot! :)

[WingedPanther]

Whew! I'm glad it worked :)

[j_berkobien]

I've been working to try and achieve a similar goal of both an image rollover and an Onclick MP3 Sound. I used the codes you gave, but the problem is:

When I click the image once, it works perfectly.
When I click the image the second time, it plays the sound two times.
When I click the image the third time, it plays the sound three times.
...etc...

I'm looking to have an image rollover that only plays once each time it is clicked. Does that make any sense? What can I do?