Skip to content Skip to sidebar Skip to footer

Why Is $(document).blur() And $(document).focus() Not Working With Safari Or Chrome?

I am making a counter which counts down when document is on focus. It stops counting down when it's on blur. It is working in FF, but with Safari and Chrome, the counter doesn't wo

Solution 1:

I've always used $(window).focus() and $(window).blur(). Try these instead.

Also, note that in FF and IE the "focus" event fires on ~document load, while in Chrome and Safari it only fires if the window had lost focus before and now it has regained it.

UPD: Now as you pasted your code, I reworked it to (hopefully) fit your purpose:

var tm;
var seconds = 50;
var inFocus = true;

functioncountdown() {
    if (seconds > 0) {
        seconds--;
    }

    if (seconds <= 0) {
        $('#timer').text('Go');
    }
    else {
        $('#timer').text(seconds);
        tm = setTimeout(countdown, 1000);
    }
}

$(function() {
    $('#timer').html(seconds);
    countdown();

    $(window).focus(function() {
         if(!inFocus) {
             countdown();
         }
    });

    $(window).blur(function() {
        inFocus = false;
        clearTimeout(tm);
        seconds++;
        $('#timer').text(seconds);
    });
});

Post a Comment for "Why Is $(document).blur() And $(document).focus() Not Working With Safari Or Chrome?"