Playing an audio/sound with Javascript when time expires is not working on Android and IOS -


i have custom made countdowntimer in javascript shows mini seconds, seconds & minutes. can see full code below, in javascript code can assign values these variables in double digits :

var minutes = 05; var seconds = 00; var tens    = 00; 

so after assigning above values, can see 5 mins. in browser show 05:00:00. in html, have 3 buttons start, stop , reset. when press start timer start running out.

now in javascript created variable var sound , assigned audio file it. there function countdowntimer { } @ end of javascript code doing work timer, in function first if statement how know timer expired. in if statement play sound sound.play();

problem :

now of works fine on desktop on mobile devices android , ios, hear no sound when timer expired.

ideas on how play sound when timer expired on android , ios appreciated. thank you!

full html , javascript timer below.

html

<div class="countdown">     <p class="audtitle">count down</p>     <div class="countdownwrapper">         <p><span id="minutes">00</span><span class="separator">:</span><span id="seconds">00</span><span class="separator">:</span><span id="tens">00</span></p>         <button id="button-start">start</button>         <button id="button-stop">stop</button>         <button id="button-reset">reset</button>     </div> </div> 

javascript

        window.onload = function () {             var minutes = 00;             var seconds = 05;              var tens = 00;              var sound = new audio('anysoundlink.mp3');              var mins = minutes;             var secs = seconds;             var mili = tens;              var appendminutes = document.getelementbyid("minutes")             var appendtens = document.getelementbyid("tens")             var appendseconds = document.getelementbyid("seconds")             var buttonstart = document.getelementbyid('button-start');             var buttonstop = document.getelementbyid('button-stop');             var buttonreset = document.getelementbyid('button-reset');              appendminutes.innerhtml = (minutes < 10) ? "0" + minutes : minutes;             appendtens.innerhtml = (tens < 10) ? "0" + tens : tens;             appendseconds.innerhtml = (seconds < 10) ? "0" + seconds : seconds;              var interval;              buttonstart.addeventlistener("click", function(){                 clearinterval(interval);                 if(minutes != 0 || seconds != 0 || tens != 0) {                     interval = setinterval(countdowntimer, 10);                 }             });              buttonstop.addeventlistener("click", function(){                 clearinterval(interval);             });              buttonreset.addeventlistener("click", function(){                 clearinterval(interval);                 minutes = mins;                 seconds = secs;                 tens = mili;                 appendminutes.innerhtml = (minutes < 10) ? "0" + minutes : minutes;                 appendtens.innerhtml = (tens < 10) ? "0" + tens : tens;                 appendseconds.innerhtml = (seconds < 10) ? "0" + seconds : seconds;             });              function countdowntimer () {                 if((minutes < 1) && (seconds == 0 || seconds == -1) && (tens < 2)) {                     sound.play();                     clearinterval(interval);                     minutes = "00";                     seconds = "00";                     tens = "00";                     appendminutes.innerhtml = minutes;                     appendtens.innerhtml = tens;                     appendseconds.innerhtml = seconds;                     return 0;                  }                 if(tens > 0) {                     tens--;                 }                 if(tens < 10) {                     appendtens.innerhtml = "0" + tens;                 }                 if (tens > 9) {                     appendtens.innerhtml = tens;                 }                 if(seconds == 0 && tens == 1) {                     seconds = 60;                     if(minutes > 0) {                         minutes--;                         appendminutes.innerhtml = minutes;                     }                 }                 if(tens <= 0) {                     tens = 100;                     if(seconds > 0) {                         seconds--;                         appendseconds.innerhtml = seconds;                     }                 }                 if(seconds < 10) {                     if(seconds > -1) {                         appendseconds.innerhtml = "0" + seconds;                     }                 }                 if(seconds > 9) {                     appendseconds.innerhtml = seconds;                 }                 if(seconds != -1 && seconds == 0 && minutes == 0) {                     tens == 100;                     seconds--;                 }                 if(seconds <= 0 && seconds != -1) {                     if(seconds != 0) {                         seconds = 59;                         if(minutes > 0) {                             minutes--;                             appendminutes.innerhtml = minutes;                         }                     } else {                         appendseconds.innerhtml = '00';                     }                 }                 if(minutes < 10) {                     appendminutes.innerhtml = "0" + minutes;                 }             }         } 

hope help. use this:

sound.reload(); 

after:

sound.play(); 

Comments

Popular posts from this blog

Is there a better way to structure post methods in Class Based Views -

performance - Why is XCHG reg, reg a 3 micro-op instruction on modern Intel architectures? -

jquery - Responsive Navbar with Sub Navbar -