Check if window is focused

JavaScript
1

Hey im trying to check if a window is focused. Im trying to do something like:

if current window is focused do this

if not do this

Does anyone know how to do this? Thanks.

2

var window_focus = true;

window.onblur = function() { window_focus = false; }
window.onfocus = function() { window_focus = true; }

if (window_focus) {
// do something
} else {
// do something else
}

Something like that?

3

Hey, you got the idea but when I tried to implement it, it didnt work. Here is the code I used:


<script language="javascript">
var window_focus = true;

window.onblur = function() { window_focus = false; }
window.onfocus = function() { window_focus = true; }

if (window_focus) {
document.title = "FOCUSED";
} else {
document.title = "NOT FOCUSED";
}
</script>

EDIT: Did some google searching now that I got the phrase window.blur and was able to make it work by doing this:


<title>CHECK IF BLURRED</title>
<script type="text/javascript">
window.onblur = blurText;
function blurText(){
	document.title='BLUR'
	window.onblur = '';
}
</script>

Thanks ScallioXTX!

4

To sum up:


<title>CHECK IF BLURRED</title>
<script type="text/javascript">
window.onblur = function (){
	document.title='NOT FOCUSED'
}
window.onfocus = function (){
	document.title='FOCUSED'
}
// too make it complete, also add onblur to document.
// For browsers using tabs (like firefox)
document.onblur = window.onblur;
document.focus = window.focus;
</script>

That should work every time the window gets / looses focus.

5

Even better. Thanks a lot! Im still trying to do the first way, with the IF. I am triggering the msg(); from flash. What its supposed to do is if there is a new msg it triggers msg(); Javascript. Flash is doing what its supposed to and I have verified that its working. The Javascript is supposed to check if the browser has focus and if it does dont change title, but if it doesnt, change to NEW MESSAGE!. This is msg(); do you see any reasons why it doesnt work?


function msg(){
	var focus = true;
	window.onblur = function() { focus = false; }
	window.onfocus = function() { focus = true; }
	document.onblur = window.onblur;
	document.focus = window.focus;
	if(focus){
		document.title="Talk";
	}else{
		document.title="NEW MESSAGE";
	}
}
6

The way you do it, the functions onblur and onfocus are only than attached to the window and the document after msg() is called for the first time. You should do it like this (so that onblur and onfocus are always attached to the document and the window):


var focus = true;
window.onblur = function() { focus = false; }
window.onfocus = function() { focus = true; }
document.onblur = window.onblur;
document.focus = window.focus;
	
function msg(){
	if(focus) {
		document.title="Talk";
	} else {
		document.title="NEW MESSAGE";
	}
}
7

Hey, that one works, when I get a new msg it changes to NEW MESSAGE but when I click on the tab with the message it doesnt go back to the default title Talk. Any ideas? Thanks for your help!

8 

var focus = true;
window.onblur = function() { focus = false; }
window.onfocus = function() { focus = true; document.title="Talk"; }
document.onblur = window.onblur;
document.focus = window.focus;
	
function msg(){
	if(focus) {
		document.title="Talk";
	} else {
		document.title="NEW MESSAGE";
	}
}
9

Works like a charm. Thank you so much!