Geek Answers Handbook

How can I fire the javascript playound onclick event without sending the user to the top of the page?

I have the following code on the page of my site - when a user clicks on an image, a sound is played:

<script language="javascript" type="text/javascript">
 function playSound(soundfile) {
 document.getElementById("dummy").innerHTML=
 "<embed src=\""+soundfile+"\" hidden=\"true\" autostart=\"true\" loop=\"false\" />";
 }
 </script>
 <span id="dummy"></span>
 <div id="soundimage">
 <a href="#" onclick="playSound('sound.mp3');"><img src="image.png" /></a>
 </div>

Everything works fine, but the image is at the bottom of the page, and when the user clicks on the image, he is redirected back to the top of the page. Is there a way to make this work so that there is only a change in sound, not a visual one (if that makes sense!)?

When using the mouseover function, for example

<a onmouseover="playSound('sound.mp3');"><img src="image.png" /></a>

the user remains where he was on the page, but I would like them to be able to play sound by click, and not when rollover.

+5
source share
3

href. # .

<a href="javascript: void(0);" onclick="playSound('sound.mp3');">...</a>

, href .

+6

( , , Javascript ), :

<a href="#" onclick="playSound('sound.mp3'); return false;">...</a>

Grexis one, , , Js, onclick , , , Js . , , .

+3

instead of having the onclick event in the tag, get rid of it and put it in the img tag. if you like the cursor for links, you can also change the style.

The sample code was indented, so it actually appears in the message.

<img src="image.png" style="cursor:pointer;" onclick="playSound ('sound.mp3')" />
0
source

More articles:


All Articles