juanbrujo · January 30, 2015 15:10
diff --git a/windowBlurFocus.css b/windowBlurFocus.css
 .focus,
 .blur {
 	transition: 1s;
 }
 .focus #focus, 
 .blur #blur { 
 	display: inline-block; 
 }
 .focus #blur, 
 .blur #focus { 
 	display: none;
 }

 .focus {
 	background: white;
 	color: black;
 }
 .blur {
 	background: black;
 	color: white;
 }
diff --git a/windowBlurFocus.html b/windowBlurFocus.html
 <html>
 	<head></head>
 	<body class="focus">

 		<div id="focus">
 			FOCUSED
 		</div>
 		<div id="blur">
 			BLURRED
 		</div>
 		
 	</body>
 </html>
diff --git a/windowBlurFocus.js b/windowBlurFocus.js
 function windowBlurFocus(){
 	var focused = true;
 	window.onfocus = function() {
 	    focused = true;
 	    onFocus();
 	};
 	window.onblur = function() {
 	    focused = false;
 	    onBlur();
 	};
 }

 function onBlur() {
 	document.title = "Blur";
 	document.body.className = 'blur';
 };
 function onFocus(){
 	document.title = "Focus";
 	document.body.className = 'focus';
 };

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

	function onBlur() {
	document.title = "Blur";
	document.body.className = 'blur';
	};
	function onFocus(){
	document.title = "Focus";
	document.body.className = 'focus';
	};

	windowBlurFocus();
No results found