Как я могу захватить размытие и фокус всего окна браузера?

Я хотел бы зафиксировать размытие и фокус фактического окна браузера - это означает, что изменение фокуса на дочерние кадры не представляет интереса.

В настоящее время я использую $(top).focus() $(top).blur()

и $(window).focus() $(window).blur()

Однако они срабатывают, когда пользователь меняет фокус на встроенные фреймы, чего я не хочу.

Кто-нибудь знает способ захвата ИСТИННОЙ активации и деактивации окна?

[EDIT]

Попытки размытия и фокуса срабатывают, когда пользователь перемещается с веб-страницы, на веб-страницу встроенного iframe. Это отличается от событий "активации окна", которые срабатывают только тогда, когда фактическое окно браузера (или вкладка) выводится на передний план или отправляется (т.е. Табуляция изменена или сведена к минимуму).

Меня не интересует размытие, потому что тот факт, что пользователь перешел во встроенный фрейм, не имеет никакого отношения к программе. Однако, если пользователь минимизирует окно, меняет вкладки или переключается на другую программу, я хочу знать об этом...

Ответ 1

вам не нужен jquery.
window.onblur и window.onfocus может решить вашу проблему: )

(function(){
    var timer = null;
    var has_switched = false;

    window.onblur = function(){
      timer = settimeout(changeitup, 2000);
    }  

    window.onfocus = function(){
      if(timer) cleartimeout(timer);
    }

    function changeitup(){
        if( has_switched == false ){
            alert('the tab lost focus')
            has_switched = true;    
        }
    }
})();

Свойство onblur может использоваться для установки обработчика размытия в окне, которое запускается, когда окно теряет фокус.

Ответ 2

У меня есть это

$(function() {

    $(window)
        .focus(function() { document.getElementById('play_banner').value = true; })
        .blur(function() { document.getElementById('play_banner').value = false; })

 })

работает отлично на IE, firefox и chrome, где баннер только оживляет, когда play_banner установлен в true, поэтому он перестает работать, когда пользователь меняет страницу, и когда он возвращается, он продолжается с того места, где он был...

Ответ 3

Если вы не заботитесь о захвате событий мыши внутри своих фреймов, вы можете добавить этот css в элементы iframe:

pointer-events:none;

Это указывает событиям мыши, чтобы они "проходили" по элементу и цели, а именно "под ним".

Обратите внимание, однако, что эта совместимость функций между браузерами может быть ограничена, и даже те, кто ее реализует, могут сделать это по-другому. Это выражение отложено на черновик CSS4 из-за количества проблем, которые он имел в различных реализациях браузеров (согласно MDN - читайте здесь: https://developer.mozilla.org/en/CSS/pointer-events)

Ответ 4

Я думаю, вы можете использовать что-то вроде следующего, чтобы отключить это поведение.

$('iframe').focusin(function(event)
{
    event.preventDefault();
    return false;
});

Ответ 5

Вы можете использовать что-то подобное для обнаружения событий браузера.

function onBlur() {
    document.body.className = 'blurred';
};
function onFocus(){
    document.body.className = 'focused';
};

if (/*@[email protected]*/false) { // check for Internet Explorer
    document.onfocusin = onFocus;
    document.onfocusout = onBlur;
} else {
    window.onfocus = onFocus;
    window.onblur = onBlur;
}

Источник Сообщение

Ответ 6

Я только исправил эту проблему для ситуации, которая у меня была. Мне нужно было подсчитать, сколько времени пользователь тратил на каждой странице.

Предыдущая реализация была примерно такой:

var isfocused = true
var time_on_page = 0;

function increment_time(){
    if(isfocused = true){
        time_on_page++;
    }
}

settimeout(increment_time, 1000);

function _blur(){
    isfocused = false
}

function _focus(){
    isfocused = true
}

$(window).blur(_blur)
$(window).focus(_focus)

Тогда у меня была та же проблема, что и у вас: всякий раз, когда пользователь вводил iframe, он переставал считать время. То, что я сделал, это слушать фокус и размывать события детей iframe, например:

var isfocused = true
var time_on_page = 0;

function increment_time(){
    if(isfocused = true){
        time_on_page++;
    }
    instrument_iframes(); //because iframes might be added later to the dom with javascript
}

settimeout(increment_time, 1000);

function _blur(){
    isfocused = false;
}

function _focus(){
    isfocused = true;
}

function instrument_iframes(){
    var iframes = $('iframe');
    for (var i=0; i<iframes.length; i++){
        var contents = $(iframes[i]).contents();
        if(contents){
            var body = contents.find('body')
            var body0 = body[0]
            if(!body0.instrumented){
                body.blur(this._blur(this));
                body.focus(this._focus(this));
                body0.instrumented = true;
            }
        }
    }
}

$(window).blur(_blur);
$(window).focus(_focus);
instrument_iframes();

С помощью этой настройки, когда пользователь вводит iframe, браузер вызывает _blur(), а затем _focus(), поэтому таймер не останавливается.

Это может быть не совсем то, что вы хотите, но в зависимости от проблемы это может быть приемлемым решением. Он работает для моего использования: -)