Go Premium for a chance to win a PS4. Enter to Win

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 664
  • Last Modified:

using javascript to play sound onMouseOver

I am trying to do something on a fun website that I have.  I have some images that are links and I am trying to make it so that when you MouseOver the link it plays a sound bite and then when you Click on the link it brings you to the appropriate place.  
I believe that I want to embed these sound bites because I do not want anything to show up on the website visually.  I just want it ot play the sound onMouseOver.  Thansk for any help you can give me.
0
makspo
Asked:
makspo
  • 9
  • 9
  • 7
  • +1
1 Solution
 
NushiCommented:
hi there.
simply add embeded tag to your html.
whne the user moves with the mouse on the <a> tag start play the wav file.

i will post a sample code in few minutes.

Nushi.
0
 
makspoAuthor Commented:
Just a little additional information.  There are a couple of links that I am going to have play different sounds.  So if I need to use the embed command there needs to be a way that I can tell it which sound bite to play for which image MouseOver.  Thanks again
0
 
NushiCommented:
i think you are looking for this:

http://developer.irt.org/script/191.htm

Nushi.
0
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
makspoAuthor Commented:
i looked at that page and it seems to be on the idea of what I am trying to do.  my question would be that how do I embed more than one sound and have different links know which sound they are referring to?

<html>
<body>

<script language="JavaScript"><!--
function playSound() { if (navigator.mimeTypes["audio/x-wav"].enabledPlugin.name == "LiveAudio") document.firstSound.play(false); }
function pauseSound() { document.firstSound.pause(); }
function stopSound() { document.firstSound.stop(); }
//--></script>

<a href="javascript:playSound()">Play the sound now!</a><br>
<a href="javascript:pauseSound()">Pause/Restart the sound</a><br>
<a href="javascript:stopSound()">Stop the sound</a><br>

<embed src="sound.wav" hidden=true autostart=false loop=false name="firstSound" MASTERSOUND>

</body>
</html>
0
 
NetGrooveCommented:
How about this:


    <OBJECT ID=myID TYPE="audio/x-wav" WIDTH=0 HEIGHT=0>
    <PARAM NAME="AUTOSTART" VALUE="false">
    <PARAM NAME="src" VALUE="sound/laugh.wav">

    your browser couldn't load the audio file

   </OBJECT>


   <A onmouseover="document.myID.play()" onmouseout="document.myID.stop()">Play</A>


0
 
NushiCommented:
simply use an id to the a and manipulate the click on it.

<script language="JavaScript"><!--
function playSound() { if (navigator.mimeTypes["audio/x-wav"].enabledPlugin.name == "LiveAudio") document.firstSound.play(false); }
function pauseSound() { document.firstSound.pause(); }
function stopSound() { document.firstSound.stop(); }
//--></script>


This is the id of the first sound:
firstSound

Simply copy this several times with diffrent id.

Nushi.
0
 
makspoAuthor Commented:
NetGroove

I did this and it works.  Is there a way that I can store all the OBJECT parameters in a function except for the actual sound file name and pass that up with the link.  Becuase it seems the way done above that I would have to include:

<OBJECT ID=myID TYPE="audio/x-wav" WIDTH=0 HEIGHT=0>
    <PARAM NAME="AUTOSTART" VALUE="false">
    <PARAM NAME="src" VALUE="sound/laugh.wav">

    your browser couldn't load the audio file

   </OBJECT>

for every soundclip that I had on my site.  I do appreciate the help so far that you have given me.
0
 
NushiCommented:
write a serverside function that does it for you.
simply creata array with names of the files and the rest is identical with all the fucntions.

<script>
function getSound( fileName ){
var reply='';
reply += "<OBJECT ID=myID TYPE='audio/x-wav' WIDTH=0 HEIGHT=0>";
reply += "<PARAM NAME='AUTOSTART' VALUE='false'>";
reply += "<PARAM NAME='src' VALUE='" + fileName + "'>"
reply += "your browser couldn't load the audio file";
reply += "</OBJECT>";

//add the code here to add this to your page
// location.innerHTML += reply
}

var files = new Array();
files [ file.length] = 'file1.wav';
files [ file.length] = 'file2.wav';
...
files [ file.length] = 'filen.wav';

the rest is to call this function:
getSound( files[index]);

Nushi.
0
 
makspoAuthor Commented:
jaysolomon

that seems to be for a single sound clip.  would i have to change that function to receive a variable and set the source as a variable that I pass up to it.  would that work?
0
 
NushiCommented:
makspo.

thats exactly what i wrote for you.

Nushi.
0
 
makspoAuthor Commented:
Nushi

thank you very much.  i am going to run to a meeting and i will give it a shot when i get out.  thanks for the help.

makspo
0
 
NushiCommented:
Np.

im here if you still have open questions.
Nushi.
0
 
NetGrooveCommented:
Here also my proposal for testing:


<html>
<head>
<script>
function play(theWave){
  document.myID.FileName = theWave;
  document.myID.play()
}
</script>
</head>
<body>
<OBJECT ID=myID TYPE="audio/x-wav" WIDTH=0 HEIGHT=0>
    <PARAM NAME="AUTOSTART" VALUE="false">
    your browser couldn't load the audio file

   </OBJECT>


   <A onmouseover="play('start.wav')" onmouseout="document.myID.stop()">Play</A>
   <A onmouseover="play('ringin.wav')" onmouseout="document.myID.stop()">Play</A>
   <A onmouseover="play('ringout.wav')" onmouseout="document.myID.stop()">Play</A>
   <A onmouseover="play('tada.wav')" onmouseout="document.myID.stop()">Play</A>

</body>
</html>



0
 
NetGrooveCommented:
And it can be anything with onMouse events:

<html>
<head>
<script>
function play(theWave){
  document.myID.FileName = theWave;
  document.myID.play()
}
</script>
</head>
<body>
<OBJECT ID=myID TYPE="audio/x-wav" WIDTH=0 HEIGHT=0>
    <PARAM NAME="AUTOSTART" VALUE="false">
    your browser couldn't load the audio file

   </OBJECT>


   <p onmouseover="play('start.wav')" onmouseout="document.myID.stop()">Start</p>
   <p onmouseover="play('ringin.wav')" onmouseout="document.myID.stop()">Ring</p>
   <p onmouseover="play('ringout.wav')" onmouseout="document.myID.stop()">Out</p>
   <p onmouseover="play('tada.wav')" onmouseout="document.myID.stop()">Tadaa</p>

</body>
</html>

0
 
makspoAuthor Commented:
Netgroove and Nushi

you both have been extremely helpful.  between the two of you all my questions are answered.  I am going to split the points between the two of you if I can figure out how to do that.  Thanks again.  
0
 
NetGrooveCommented:
Splitting fifty points is not a big thing.
Better give them all to Nushi (and next time to me :)

0
 
NushiCommented:
you have to accept answer as assist answer.
accept the 2 comments from both of us and that will split the points between us.

Thank you netGroove for your kindness.
ill remember it :-)).
but it should be splitted between us.

Nushi.
0
 
NetGrooveCommented:
You do not know me, I was hopping next time more then fifty points :)
0
 
NushiCommented:
>>I was hopping next time more then fifty points

i watching you for the past month since you came here.
you are GOOD.

Nushi.
0
 
NetGrooveCommented:
thanks.
0
 
makspoAuthor Commented:
I was going to split the points amongst the two of you.  Sorry if this should have been worth more than 50 points.  I never know how to judge.  I accepted NetGroove and now I am trying to go back to accept Nushi to split and there is no option to accept another answer.  How do I split.
0
 
NushiCommented:
makspo if you still wish to give me some points (you dont have to )
simply open a question and place refferer to this question.

Nushi.
0
 
makspoAuthor Commented:
I would like to give you some points.  you were extremely helpful for me.  do you mean open a brand you question?  what do you mean place referrer?
0
 
makspoAuthor Commented:
NetGroove

I read through your code and it looked like exactly what I was looking for but I just tried to run it and I get a javascript error on this line every time:

document.myID.play()

this is the last line of the function.  I am not sure if since i already accepted your answer if you are even looking at this thread anymore.  if you happen to notice this question and could give me a little insight I would greatly appreciate it.  
0
 
NetGrooveCommented:
Even when no wave files are found does the error not appear in IE6.0

Which browser are you testing?

0

Featured Post

VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

  • 9
  • 9
  • 7
  • +1
Tackle projects and never again get stuck behind a technical roadblock.
Join Now