Cách phát hiện trình duyệt thu nhỏ và tối đa hóa trạng thái trong javascript

Question

Tôi đang cố gắng tìm trình duyệt thu nhỏ và tối đa hóa các trạng thái, vì tôi muốn nhấn yêu cầu AJAX phù hợp với trạng thái trình duyệt.

Có ai biết làm cách nào để phát hiện trạng thái trình duyệt bằng JavaScript.

Answer 1

Bạn có thể thử với API hiển thị trang, tài liệu này có thuộc tính boolean document.hidden (document.webkitHidden), cũng phát hiện xem trang hiện tại có được thu nhỏ hay phóng to hay không. Nó cũng phụ thuộc cho dù người dùng đã tập trung tab trình duyệt hiện tại hay không:

https://developers.google.com/chrome/whitepapers/pagevisibility

https://developer.mozilla.org/en/DOM/Using_the_Page_Visibility_API

Answer 2

Tôi nghĩ rằng cách duy nhất đáng tin cậy để phát hiện những tình trạng này là để kiểm tra visibility API được cung cấp bởi HTML5 (đây vẫn là một tính năng thử nghiệm) trong đó cung cấp các thuộc tính và các sự kiện nhất định

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  

Bạn cũng có thể phản ứng về những thay đổi của khả năng hiển thị

document.addEventListener("visibilitychange", function() { 
    console.log(document.hidden, document.visibilityState); 
}, false); 

Hãy nhớ điều này không hoạt động trên trình duyệt chéo và chỉ khả dụng trong một số phiên bản trình duyệt nhất định.

Answer 3

tôi sử dụng mã này

window.addEventListener('blur', function(){ 
    console.log('blur'); 
}, false); 

window.addEventListener('focus', function(){ 
    console.log('focus'); 
}, false); 

Answer 4

Dưới đây là Piotrek De 's answer on another question:

Có một thư viện gọn gàng sẵn trên GitHub:

https://github.com/serkanyersen/ifvisible.js

Ví dụ:

012.351.

// If page is visible right now 
if(ifvisible.now()){ 
    // Display pop-up 
    openPopUp(); 
} 

Tôi đã thử nghiệm phiên bản 1.0.1 trên tất cả các trình duyệt và tôi có thể xác nhận rằng nó hoạt động với:

• IE9, IE10
• FF 26,0
• Chrome 34.0

và có lẽ tất cả các phiên bản mới hơn.

Không hoàn toàn làm việc với:

• IE8 - luôn luôn chỉ ra rằng tab/cửa sổ đang hoạt động (Now() luôn trả về true đối với tôi)