<script src="sound.js" language="JavaScript" type="text/javascript">
</script>
<span id="SoundObj"></span>
Step 1 -- place a code object on your page
Include the above code object on your page:
- Set CSS positioning to off (top toolbar in Text Editor)
- Send it 'To Back' (buttons on the bottom toolbar). Or near to back -- the exact location does not matter too much.
This code does two things:
- It includes an external Javascript file in your page: sound.js, which has the code to trigger the sound.
- It includes an invisible object on your page to which the code applies the sound.
Step 2 -- Make the Javascript sound file
Place the above code in a file called 'sound.js'. This is the code responsible for attaching a sound to the invisible SoundObj object.
Or you can download my sound.js here -- it's the one used on this page.
function Sound(aFileName) {
ThisObj=document.getElementById ('SoundObj')
ThisObj.innerHTML="<embed src='"+aFileName+"' height=0 width=0 autostart=true loop=false>";
}
Ref: Virtual Mechanics Forums
Here is another method of adding sound to your pages. The advantage of this method is that it claims to also work with recent versions of Firefox, Opera and Netscape. I haven't actually tested it though, on anything other than IE6 -- hope the claims are correct.
Following are the steps needed to add sound to your pages, and also the ones I followed to get sound on to this page. I have used a file called 'pop.wav'. Whenever you see that name, substitute the name of your file.
Step 3 -- Sound files to Preview folder
Place the sound files you plan to use into your preview folder. Also place there the Sound.js file you created in Step 2 above.
This step allows you to preview your project with sound working.
Step 4 -- Make the special links
In order to make the sound play when you click on or mouseove a particular object, you need a special link. This is different to the standard link you may be used to.
OnClick link -- sound when you click on it
The next image shows the Quick Editor Link tab for an onClick sound. The key field to fill out is the URL which is this: javascript:Sound('pop.wav')
OnMouseover Link -- sound when you mouse over on it
The next image shows the Quick Editor Link tab for an onMouseover sound. The key fields to fill out are the URL which is this: javascript:void('')
and the Code field which is this: onMouseover="Sound('pop.wav')"
My sound file is called 'pop.wav' (download it here -- right click the link and select 'Save Target As')
Substitute your file. You can have several sound files on a page. The only requirements are that:
- the links you make must include the file name
- if you want to preview, the file must be in your preview folder
Step 5 -- publishing
If you normally publish your project to disk, then FTP the files to your site, also FTP your sound files and the file sound.js to the root folder of your site.
If you normally use the built-in FTP in SiteSpinner, include your sound files and the file sound.js in your project as 'Foreign Objects' in the Format of 'Publish File'. When you publish, this gets the files into the root folder of your site.
Finally
If something is not clear, wrong or missing, please post a comment in the VM forums in this thread.