Is there a browser event for the window getting focus?
You can attach focus
and blur
event handlers on the window
object to track if the window gets or loses focus (see http://jsfiddle.net/whQFz/ for a trivial example). window
applies to the current browser context (so that could be a window, a tab, a frame, etc.).
Note : The focus
event will fire every time the window gets focus and the blur
event will fire every time it loses focus. An example of something that takes focus away from the window is an alert
window. If you try to alert in an onfocus
event handler you'll get an infinite loop of alerts!
// Set global counter variable to verify event instances
var nCounter = 0;
// Set up event handler to produce text for the window focus event
window.addEventListener("focus", function(event)
{
document.getElementById('message').innerHTML = "window has focus " + nCounter;
nCounter = nCounter + 1;
}, false);
// Example of the blur event as opposed to focus
// window.addEventListener("blur", function(event) {
// document.getElementById('message').innerHTML = "window lost focus"; },
// false);
$(document).ready(function() { $(window).one("focus", SomeFocusMethod); } );
var SomeFocusMethod = function()
{
// do stuff
$(window).one("blur", SomeBlurMethod);
}
var SomeBlurMethod = function()
{
// do stuff
$(window).one("focus", SomeFocusMethod);
}
If you are targeting browsers newer than IE9 you should really use the "Page Visibility API" javascript browser api: https://developer.mozilla.org/en-US/docs/Web/Guide/User_experience/Using_the_Page_Visibility_API
function blinkTab() {
const browserTitle = document.title;
const stopBlinking = () => {
document.title = browserTitle;
};
const startBlinking = () => {
document.title = 'My New Title';
};
function registerEvents() {
window.addEventListener("focus", function(event) {
stopBlinking();
}, false);
window.addEventListener("blur", function(event) {
setInterval(() => {
startBlinking();
}, 500);
}, false);
};
registerEvents();
};
blinkTab();