/    Sign up×
Community /Pin to ProfileBookmark

Problem restarting wav file from beginning of sound file in Javascript

Hi Guys,

I have sound code to play a file in Javascript when moving the cursor over an image (onmouseover), and similarly to turn off the sound clip when moving away from the image (onmouseout). This code works fine. The problem is that if you roll-over and off the image, and roll-over the image again, instead of starting the whole sound clip from the beginning, you may only hear the end portion the clip. It picks-up where you left off. Does anyone know if there is a way that the whole clip can be played from the beginning? (I have to include about 30 images with varying sound clips in one web page).

Many thanks

Code:

function EvalSound(soundobj)
{
var thissound;
thissound=eval(“document.”+soundobj);
thissound.Play();
}

function EvalSoundStop(soundobj)
{
var thissound;
thissound=eval(“document.”+soundobj);
thissound.stop();
}

<EMBED src=”xxxx.wav” autostart=false name=”sound1″ enablejavascript=”true”>

<A HREF=”” onmouseover=”EvalSound(‘sound1’);” onmouseout=”EvalSoundStop(‘sound1’);”>
<IMG SRC=”xxxx.jpg”>
</A>

to post a comment
JavaScript

9 Comments(s)

Copy linkTweet thisAlerts:
@gil_davisMar 23.2007 — There are no W3 standards for playing sounds. It depends on what is installed on the client's machine.

For Windows MediaPlayer, you can try:<i>
</i>function EvalSoundStop(soundobj)
{
var thissound;
thissound=eval("document."+soundobj);
thissound.stop();
thissound.currentPosition = 0;
}
Copy linkTweet thisAlerts:
@friendlyfaceauthorMar 23.2007 — Thanks a million Gil - this worked a treat! ?
Copy linkTweet thisAlerts:
@mattnw1Nov 16.2007 — i am running a similar script to friendlyface but unfortunately Gil's suggestion didn't work for me.

Any other ways of restarting the sound file when the user mouse (aways) from the image and mouseovers again?

<script>

function EvalSound(soundobj) {

var thissound= eval("document."+soundobj);

thissound.Play();

thissound.currentPosition = 0;

}

function EvalSoundOff(soundobj) {

var thissound= eval("document."+soundobj);

thissound.Stop();

thissound.currentPosition = 0;

}

</script>

im using safari on a mac, btw
Copy linkTweet thisAlerts:
@savvykmsNov 16.2007 — Here is one way, but it may or may not work and may or may not be in the standards. But here it is anyways, works in latest IE7 anyways.
[CODE]
<script language="javascript" type="text/javascript">
<!--
function playsound(sound) { document.getElementById("mysound").src = sound; }
function stopsound() { document.getElementById("mysound").src = ""; }
-->
</script>
[/CODE]

[CODE]
<p onmouseover="playsound('mywave.wav')" onmouseout="stopsound()">mouseoverme</p>
[/CODE]
Copy linkTweet thisAlerts:
@mattnw1Nov 16.2007 — thanks,

how do I write an if else statement so if one sound is playing (from mouseclick) and then the user clicks another sound link it stops the first one and starts the new one. At the moment the sounds overlap and play at the same time

many thanks for any help
Copy linkTweet thisAlerts:
@savvykmsNov 16.2007 — What do you mean? A link that plays a sound?
[CODE]
<a href="javascript://" onclick="stopsound(); playsound('sound1.wav');">sound 1</a>
<a href="javascript://" onclick="stopsound(); playsound('sound2.wav');">sound 2</a>
<a href="javascript://" onclick="stopsound(); playsound('sound3.wav');">sound 3</a>

<a href="sound1.wav"> file: sound1.wav</a>
<a href="sound2.wav"> file: sound2.wav</a>
<a href="sound3.wav"> file: sound3.wav</a>
[/CODE]

Think it should work...
Copy linkTweet thisAlerts:
@mattnw1Nov 16.2007 — ok maybe you have sorted it but check out this link:

http://yo50.com/1296/sound.html

you will see that the top left hand block and the one below it are links from an imagemap that play two different sound files

the problem is that when you click the first block it plays and if you click the one below it, it starts playing over the top of the first one...

i need for the first one (or anyone for that matter) to stop when another link is clicked (and the new sound plays)

hope that makes sense and from the code you can see what im babbling about

grateful appreciation
Copy linkTweet thisAlerts:
@savvykmsNov 16.2007 — Original code:
[CODE]<area shape="rect" alt="" coords="0,0,9,9" href="#" onMouseDown="EvalSound('sound1')" onMouseOut="EvalSoundOff('sound1')">
<area shape="rect" alt="" coords="0,10,10,19" href="#" onMouseDown="EvalSound('sound2')" onMouseOut="EvalSoundOff('sound2')">[/CODE]

Will this work?
[CODE]
<area shape="rect" alt="" coords="0,0,9,9" href="#" onmousedown="EvalSound('sound1'); EvalSoundOff('sound2')" onmouseup="EvalSoundOff('sound1')">
<area shape="rect" alt="" coords="0,10,10,19" href="#" onmousedown="EvalSound('sound2'); EvalSoundOff('sound1')" onmouseup="EvalSoundOff('sound2')">
[/CODE]
Copy linkTweet thisAlerts:
@mattnw1Nov 16.2007 — no those links didnt work?

so it doesnt need an if statement then?

cause it works fine apart from not stopping when a new one is clicked
×

Success!

Help @friendlyface spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 BETA 5.5,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,

tipper: @Samric24,
tipped: article
amount: 1000 SATS,
)...