Как я могу захватить размытие и фокус всего окна браузера?
Я хотел бы зафиксировать размытие и фокус фактического окна браузера - это означает, что изменение фокуса на дочерние кадры не представляет интереса.
В настоящее время я использую
$(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(), поэтому таймер не останавливается.
Это может быть не совсем то, что вы хотите, но в зависимости от проблемы это может быть приемлемым решением.
Он работает для моего использования: -)