Detectar Blur / Focus a la ventana

30/ene/2015 1

Este pequeño snippet permite detectar y realizar alguna acción mediante JavaScript cuando una ventana/tab esté activa (focus) ó desactiva (blur).

Algunas aplicaciones útiles que se me ocurren:

  • Guardar datos si el usuario está en un formulario.
  • Iniciar/detener animaciones que quieras que el usuario vea.

A pesar de actualmente existir una API para Page Visibility sabemos que su soporte para IE es escaso. En este caso se utilizarán los eventos onfocus y onblur los que tienen buen soporte (IE8+).

function windowBlurFocus(){
  var focused = true;
  window.onfocus = function() {
    focused = true;
    onFocus();
  };
  window.onblur = function() {
    focused = false;
    onBlur();
  };
}

Ver Ejemplo

Comentarios

  1. Antonio [#]

    No se porque pones la variable var focused, no hace falta para que se aplique el onblur o el onfocus.

Deja tu Comentario

Tu dirección de correo electrónico no será publicada. Los campos necesarios están marcados *

CSSLab