CODEWITHSUNDEEP
javascriptcsshtmlaudio
self-learner
self-learner

Reputation: 19

Audio should play before being redirected to a link

I am new to website development and am learning that independently. In my website i am having a Audio nested within a button at the top of the page. If the user muted the audio, the rest of the navigation links will not have that music played. else each time the user clicks a link, the audio will be played before being redirected to another link.

My HTML code is as such:

<a href="javascript:void(0)"><span id="facebook" onclick="playLink(this.id)">facebook</span></a>

my java code is as such:

function playLink(id)
{

if(audio1.muted==true && id=="facebook")
{
 window.location.href="https://www.facebook.com/?stype=lo&jlou=AfdeVGNZ2wkOmLR2JKTDO5TQxnERQXFcGGG5gBl3mieEaFJq-_rbey251tojJmP3jetCtclLhIYstrSsHlonyLoa&smuh=44193&lh=Ac_NtNBBW6lW7Cwg";
}

if(audio1.muted==false && id=="facebook")
{
  audio1.play();
  alert("1");
  if(audio1.ended)
  window.location.href="https://www.facebook.com/?stype=lo&jlou=AfdeVGNZ2wkOmLR2JKTDO5TQxnERQXFcGGG5gBl3mieEaFJq-_rbey251tojJmP3jetCtclLhIYstrSsHlonyLoa&smuh=44193&lh=Ac_NtNBBW6lW7Cwg;
 }
 }

the problem is the background sound plays and navigates successfully after the ending of the clip, only if i add an alert after audio1.play(). else it plays the sound but does not navigate to the linked page. how do i fix it?

Any help is appreciated. thanks!

P.S: the a is part of the bootstrap nav bar.

Upvotes: 0

Views: 237

Answers (1)

Sudhansu Choudhary
Sudhansu Choudhary

Reputation: 3360

Try this, use some time lapse using setTimeout as,

if(audio1.muted==false && id=="facebook")
{
  audio1.play();
  //alert("1");
  setTimeout(function(){
            if(audio1.ended){
             window.location.href="https://www.facebook.com/?stype=lo&jlou=AfdeVGNZ2wkOmLR2JKTDO5TQxnERQXFcGGG5gBl3mieEaFJq-_rbey251tojJmP3jetCtclLhIYstrSsHlonyLoa&smuh=44193&lh=Ac_NtNBBW6lW7Cwg;
            }
      }, 200);
}

Upvotes: 1

Related Questions