如何检测无效选项卡并用颜色填充

Question

如果选项卡处于非活动状态，如何使用颜色填充我的网站？如果用户移动到另一个窗口，我想给我的网站提供类似于屏幕保护程序的效果。我可以用jQuery来做到吗？

Answer 1

下面是一些基本的代码，让你去：

<script type="text/javascript"> 
document.onmousemove = resetTimer; 
window.onload = function() { 
    screenTimer = setTimeout(inactive, 2000); 
} 
function inactive(){ 
    // screen saver goes here 
    document.body.style.backgroundColor = "black"; 
} 
function resetTimer(e) { 
    // undo screen saver here 
    document.body.style.backgroundColor = "white"; 
    // reset timer 
    clearTimeout(screenTimer); 
    screenTimer = setTimeout(inactive, 2000); 
} 
</script> 

使用jQuery你也许可以清理一下了一点，但是这应该给一个简单的基础建立过的。

基本上，我们每2秒钟都会打电话给“启动屏幕保护程序”，但如果您移动鼠标，它将取消定时器并启动它。注意：setTimeout使用毫秒，因此1000 = 1秒。

Answer 2

使用window.onfocus（）和window.onblur（）方法 - 看http://www.thefutureoftheweb.com/demo/2007-05-16-detect-browser-window-focus/用于演示