API toàn màn hình: Sự kiện nào được kích hoạt?

Question

Tôi cần biết sự kiện (DOM) nào được kích hoạt khi người dùng vào chế độ toàn màn hình thông qua Fullscreen API mới. Tôi cố gắng ví dụ đoạn này, nhưng nó không cháy:

jQuery('body').on('fullScreenChange', function() { alert("Fired!"); }); 

Answer 1

Liên kết của bạn shows the answer ...

Khi chế độ toàn màn hình là tham gia thành công, các tài liệu có chứa các yếu tố toàn màn hình nhận được sự kiện fullscreenchange. Khi chế độ toàn màn hình bị thoát, tài liệu lại nhận được sự kiện fullscreenchange. Lưu ý rằng sự kiện fullscreenchange không tự cung cấp bất kỳ thông tin nào về việc liệu tài liệu có đang nhập hoặc thoát chế độ toàn màn hình hay không, nhưng nếu tài liệu có một số không rỗng là fullScreenElement, bạn biết bạn đang ở chế độ toàn màn hình.

Answer 2

Có no fullscreenChange event in native jQuery. Nhưng có một số plugin của bên thứ ba mà cung cấp cho bạn truy cập vào sự kiện:

• http://johndyer.name/native-fullscreen-javascript-api-plus-jquery-plugin/
• https://github.com/ruidlopes/jquery-fullscreen/blob/master/jquery.fullscreen.js
• https://github.com/hdragomir/jQuery-Fullscreen-Event
• https://github.com/ruidlopes/jquery-fullscreen

Như bạn có thể nhìn thấy trên mã của họ có không có quyền truy cập API rõ ràng vào loại sự kiện này.

Answer 3

Tôi đã sử dụng:

$(document).on('webkitfullscreenchange mozfullscreenchange fullscreenchange MSFullscreenChange', fn); 

Nó bắn cho Safari, Chrome và Firefox (đã không kiểm tra những người khác). Dường như có sự khác biệt tinh tế trong ngữ cảnh kết quả giữa webkit và moz, chiều cao và chiều rộng phần tử khác nhau. Nhưng các sự kiện cháy, đó là câu hỏi của bạn.

Oh. Và xem ra để sử dụng alert('fs') với thử nghiệm toàn màn hình. Nó thường cản trở sự thay đổi màn hình.