Solved

Play sound when a link is clicked

Posted on 2007-11-26
7
1,000 Views
Last Modified: 2013-12-07
EE,
I am trying to find code for JavaScript that will play a sound (.wav file) when a link is clicked. I do not want the sound to play when the page loads and I am only going to associate it with a single link on a page.

I would like it to play in IE and FireFox, but if I can get it work only in IE that would fine.

Any help would be greatly appreciated.

dresdena1
0
Comment
Question by:dresdena1
7 Comments
 
LVL 15

Expert Comment

by:spprivate
ID: 20351795
Just create a link to this wav file like any other hyperlink.Rest will be taken care by the browser.
<A HREF = "mymusic.wav" >Listen Sound </A>
Thats it
0
 

Author Comment

by:dresdena1
ID: 20351829
spprivate,
Thanks for the quick response.
I will already be using the link to go to another page.

dresdena1
0
 
LVL 12

Expert Comment

by:Sinoj Sebastian
ID: 20351879
Try this
------------------------------------
function DHTMLSound(surl) {
  document.getElementById("dummyspan").innerHTML=
    "<embed src='"+surl+"' hidden=true autostart=true loop=false>";
}

<span id='dummyspan'></span>
<form>
<img src="play.gif" onClick="DHTMLSound('success.wav')">
</form>
---------------------------------------
This should work in IE and FF
0
Gigs: Get Your Project Delivered by an Expert

Select from freelancers specializing in everything from database administration to programming, who have proven themselves as experts in their field. Hire the best, collaborate easily, pay securely and get projects done right.

 

Author Comment

by:dresdena1
ID: 20352064
sinoj,
I am trying to get this to work on a horizontal line of text links. I believe that the form tag is causing a line break.
To try to get sound to play, I enclosed the <a href in the form tags and replaced the img src with a href and then put the DHTMLSound with the sound file that I am interested in playing.
It didn't work.

Do I need to enclose the function in <script>  tags?
It showed through the browser so I enclosed in <script> tags to hide it and I also tried putting it in the <HEAD> section.

I am still unable to get any sound.

Here is my last try:
<<
<script>
function DHTMLSound(surl') {
  document.getElementById("dummyspan").innerHTML=
    "<embed src='"+surl'+"' hidden=true autostart=true loop=false>";
}
</script>

<span id='dummyspan'></span>
<form>
<a href="race_schedule.html" onClick="DHTMLSound('cowbell.wav')">Races</a>&nbsp;&nbsp;&nbsp;
</form>
>>

Any ideas?
Thanks very much
 dresdena1
0
 
LVL 12

Accepted Solution

by:
Sinoj Sebastian earned 125 total points
ID: 20352344
Ok here you go........
------------------------------------------------------------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
      <script type="text/javascript">
            function DHTMLSound(surl) {
              document.getElementById("dummyspan").innerHTML= "<embed src='"+surl+"' hidden=true autostart=true  loop=false>";
            }
            function delayedRedirect(){
                  document.getElementById("dummyspan").innerHTML = ""
                      window.location = "http://www.google.com"
            }
      </script>
</head>
<body >
      <span id=dummyspan></span>
      <A HREF = "#" onclick="DHTMLSound('http://www.phon.ucl.ac.uk/home/mark/audio/success.wav');  setTimeout('delayedRedirect()', 1000); return false;">Play Sound and Redirect</A>


</body>
</html>
------------------------------------------------------------------------
You may change the time out interval, depending up on the length of the sound track.
0
 
LVL 28

Expert Comment

by:Pravin Asar
ID: 20353348
0
 

Author Closing Comment

by:dresdena1
ID: 31411031
sinoj,
Perfect! Thanks very much!

dresdena1
0

Featured Post

Courses: Start Training Online With Pros, Today

Brush up on the basics or master the advanced techniques required to earn essential industry certifications, with Courses. Enroll in a course and start learning today. Training topics range from Android App Dev to the Xen Virtualization Platform.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Browser Chrome downloads colored link 5 40
Parsing an RSS Feed 4 15
Simple Total function not working 8 30
"Pause" execution of javascript function for x miliseconds 2 22
Internet is a big network which is formed by connecting multiple small networks.It is a platform for all the users which are connected to it.Internet act as platform in different fields. Such as: Internet  as a collaboration platform. Internet  as…
If you are a web developer, you would be aware of the <iframe> tag in HTML. The <iframe> stands for inline frame and is used to embed another document within the current HTML document. The embedded document could be even another website.
This Micro Tutorial will demonstrate how to add subdomains to your content reports. This can be very importing in having a site with multiple subdomains.
Shows how to create a shortcut to site-search Experts Exchange using Google in the Chrome browser. This eliminates the need to type out site:experts-exchange.com whenever you want to search the site. Launch the Search Engine Menu: In chrome, via you…

785 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question