onclick sound?

[MarkC]

Does anyone have a small javascript that will trigger a local (small) wav sound event when an anchor tag is clicked?

[2 peachy]

You can use scripts to control sound in a number of different ways. One thing people often want to do is have a transition sound, a sound that plays when they click on a link to another page.

If you're using IE, when you click on a link in the menu to your left, you'll hear a little "brrrling" sound as the linked page loads. If you don't hear it, you might not have your speakers turned up loud enough. (We're still working out the kinks in supporting the various Netscape releases; we hope a cross-browser version is coming soon!)

Here's how to do this:

First, at the top of your page between the <script> and </script> tags, you'll add a function that tests to see what browser the reader is using and, if he or she is using IE4 or later, creates a function that we named "clickSounder." It also calls the sound file you'll be using; by calling for the sound here, it will play when the page first loads and remain the the browser cache, so that it needn't be reloaded when the reader clicks on a link. That bit of scripting looks like this:

ie4 = ((navigator.appName == "Microsoft Internet Explorer") && (parseInt(navigator.appVersion) >= 4 ));
function clickSounder(){
if (ie4){

clickSnd.src="/developer/audioz/AZsounds/azBut&roll/jRdrm1.mid";
}
}


This function works only with Internet Explorer, but it won't break on Netscape. It's best used in a framed table-of-contents type file.

Next, each time you add a link that plays the sound, you'll need to add a snippet of JavaScript to your anchor tag, like this:

<a href="06-scripting.html" onClick="clickSounder();">Scripting Sound</a> <bgsound id="clickSnd" src="/developer/audioz/AZsounds/azBut&roll/jRdrm1.mid" volume=-1500>

The anchor tag calls the linked file as usual. In this example the linked file is called "06-scripting.html."
After the URL, the onClick eventhandler tells the browser that when a reader clicks on this link, it should use the function named clickSounder.
Then you complete the anchor tag as usual, adding the linked text and the end anchor tag.
Immediately following the anchor tag, you'll need to specify the sound that should play, using the bgsound tag. The id switch value is "clickSnd," the name we gave the sound we loaded as part of the script at the beginning of the page. The src switch specifies the URL of the sound. The volume switch says how loud to play the sound -- values range from -1500 to 1500.

[MarkC]

Thanks so much for your help. Every time I try to write something like this it never works, or works unpredictably... I'm on my way to try this out, thanks again!

[2 peachy]

did it work for you ?

[MarkC]

The script works fine - but is not quite what I'm looking for. The sound occurs in this script both as the page loads (bgsound) and also onMouseOver when what I wanted was merely for a sound to execute as an onClick event only, much like a doorbell. I see from some javascript websites that you could use a similar detect/function script with sound array and then include the onClick function inside the actual <A HREF> tag. (<A HREF="javascript:playAudio(1);"></A>) When I tried that one I kept getting error messages (it was late...) and besides I need to have the <A HREF> tag to call a new URL/webpage. So, I am back at square one this morning. Thanks for your help, and if you have any more suggestions they would be more than welcome!
Mark

[Webkins]

HI 2 Peachy

I have been watching your threads and hoping you can help me too. I am helping a band put music tracks on their site.

http://www.theexorsisters.co.uk/jukebox.htm
The code is too long to paste in. The thing is, it works for many but some are not getting the sound. I have amended the code so much I think I am on the brink of messing the thing up.

I read that i need bgsound and embed, but am at a loss where to put these. The instruction is onclick and there will be 3 or 4 tracks by the end of it, accessable via radio buttons.

I would be really grateful if you could point me in the right direction. Or at least tell me I am wasting my time.

Thanks loads

x :confused:

[MjhLkwd]

Click link to play media, and open new window:


<HTML>
<Head>
<Script type="text/javascript">

audioFX = new Array()
audioFX[0] = "media/song1.mp3";
audioFX[1] = "media/song2.mp3";
audioFX[2] = "media/song3.mp3";

function playFX(isFX,URL){

isSelection = audioFX[isFX];
embedStr = "<Embed Src="+isSelection+" Width=0 Height=0></Embed>"
document.getElementById('isEmbed').innerHTML = embedStr;
window.open(URL);
}

</Script>
</Head>
<Body>
<Div id='isEmbed'></Div>
<a href=javascript:playFX(0,'nextPage.html')> Song 1 </a><br>
<a href=javascript:playFX(1,'anotherPage.html')> Song 2 </a><br>
<a href=javascript:playFX(2,'differentPage.html')> Song 3 </a>
</Body>
</HTML>