有趣的浏览器活跃窗口监听

2016-04-11

有趣的浏览器活跃窗口监听

window.onblur & window.onfocus

在浏览器中，有这样两个事件监听 window.onblur & window.onfocus，
分别表示的是窗口失去焦点和窗口处于活跃状态，什么意思呢？

即在你浏览其他窗口页面、或是浏览器最小化、又或是点击了其他程序等等，都算是浏览器窗口失去焦点，那么 window.onblur 事件就会触发。
同样的，当你回到该窗口浏览网页，该窗口就处于活跃状态，相应的 window.onfocus 事件也会触发。

那么我们可以利用这两个事件做哪些有趣的东西呢？

让网页标题变得有趣

首先来我的博客感受一下吧，地址：安生博客，
打开网页之后，点击其他窗口，然后再次回到安生博客，期间请注意网页标题的变化，是不是很好玩。
没错，玩的就是心机，让你不看我的博客哈哈。

代码实现

代码非常地简单，以致于你不得不感叹世界真的很奇妙。
接下来将是一段愉悦的时光，因为马上我就要把我的全世界摆在你的面前了。

(function () {
  var title = document.title
  window.onblur = function () {
    document.title = '网页崩溃了，快看！'
  }

  window.onfocus = function () {
    document.title = title
  }
})()

将以上代码放在你的html文件中即可。