Question

I have the following code. The countdown works, but the stopping of the timer when window is not on focus doesn’t work. Also, I’d like to resume the countdown when window is on focus.

In my code below, the $(document).blur() event doesn’t work, but when I replace blur by click(), it works. Is there any problem with the blur() and document?

var tm;
$(document).ready(function(){    
   function countdown(){ 
         if (seconds > 0) {
            seconds--; 
            $('#timer_div').text(seconds);
            tm = setTimeout(countdown,1000);
            }
        if (seconds<=0){ 
            $('#timer').text('Go');
            }   
        } 

        var seconds = 50;
        $('#timer').html(seconds);
        countdown();

    });
    $(document).blur(function(){
        clearTimeout(tm);
        seconds++;
        $('#timer').text(seconds);

    });

Answer 1

var tm;
$(document).ready(function(){    
   function countdown(){ 
         if (seconds > 0) {
            seconds--; 
            $('#timer_div').text(seconds);
            tm = setTimeout(countdown,1000);
            }
        if (seconds<=0){ 
            $('#timer').text('Go');
            }   
        } 

        var seconds = 50;
        $('#timer').html(seconds);
        countdown();

    });
    $(document).blur(function(){
        clearTimeout(tm);
        seconds++;
        $('#timer').text(seconds);

    });