Javascript 如何在javascript中检测浏览器最小化和最大化状态
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/10328665/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How to detect browser minimize and maximize state in javascript
提问by Ashish
I am trying to find the browser minimize and maximize states, as I want to hit the AJAX request accordingly the browser state.
我试图找到浏览器最小化和最大化状态,因为我想根据浏览器状态点击 AJAX 请求。
Does anyone know how do I detect the browser state using JavaScript.
有谁知道如何使用 JavaScript 检测浏览器状态。
回答by Tobias Krogh
I think the only reliable way to detect these states is to check the visibility APIoffered by HTML5 (this is still an experimental feature) which offers certain properties and events
我认为检测这些状态的唯一可靠方法是检查HTML5 提供的可见性 API(这仍然是一个实验性功能),它提供了某些属性和事件
document.hidden // Returns true if the page is in a state considered to be hidden to the user, and false otherwise.
document.visibilityState // Returns a string denoting the visibility state of the document
You can also react on changes of the visibility
您还可以对可见性的变化做出反应
document.addEventListener("visibilitychange", function() {
console.log(document.hidden, document.visibilityState);
}, false);
Keep in mind this is not working cross browser and only available in certain browser versions.
请记住,这不适用于跨浏览器,并且仅在某些浏览器版本中可用。
回答by user1089766
Here's Piotrek De's answer on another question:
There is a neat library available on GitHub:
https://github.com/serkanyersen/ifvisible.js
Example:
// If page is visible right now if( ifvisible.now() ){ // Display pop-up openPopUp(); }
I've tested version 1.0.1 on all browsers I have and can confirm that it works with:
- IE9, IE10
- FF 26.0
- Chrome 34.0
and probably all newer versions.
Doesn't fully work with:
- IE8 - always indicate that tab/window is currently active (.now() always returns true for me)
GitHub 上有一个简洁的库:
https://github.com/serkanyersen/ifvisible.js
例子:
// If page is visible right now if( ifvisible.now() ){ // Display pop-up openPopUp(); }
我已经在我拥有的所有浏览器上测试了 1.0.1 版,并且可以确认它适用于:
- IE9、IE10
- FF 26.0
- 铬 34.0
可能所有较新的版本。
不完全适用于:
- IE8 - 始终指示选项卡/窗口当前处于活动状态(.now() 始终为我返回 true)
回答by Justan
I use this code
我用这个代码
window.addEventListener('blur', function(){
console.log('blur');
}, false);
window.addEventListener('focus', function(){
console.log('focus');
}, false);
回答by Samuli Hakoniemi
You can try with Page Visibility API, it has the boolean property document.hidden (document.webkitHidden), which also detects whether current page is minimized or maximized. It is also dependant whether user has focused current browser tab or not:
您可以尝试使用 Page Visibility API,它具有布尔属性 document.hidden (document.webkitHidden),它还检测当前页面是最小化还是最大化。还取决于用户是否已聚焦当前浏览器选项卡:
https://developers.google.com/chrome/whitepapers/pagevisibility
https://developers.google.com/chrome/whitepapers/pagevisibility
https://developer.mozilla.org/en/DOM/Using_the_Page_Visibility_API
https://developer.mozilla.org/en/DOM/Using_the_Page_Visibility_API