退出全屏模式时捕获ESC事件 [英] Capture ESC event when exiting full screen mode
本文介绍了退出全屏模式时捕获ESC事件的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
对我的要求当我按下按钮
并在页面恢复正常模式时隐藏该div时,我必须以全屏模式显示特定的div。
Requirement for me I have to show a particular div in full screen mode when I press a button and hide that div when the page comes back to normal mode.
我可以使用以下代码实现全屏模式: -
I am able to achieve full screen mode with the code :-
function launchFullscreen(element) {
if (element.requestFullscreen) {
$('#bmessages').show();
element.requestFullscreen();
} else if (element.mozRequestFullScreen) {
$('#bmessages').show();
element.mozRequestFullScreen();
} else if (element.webkitRequestFullscreen) {
$('#bmessages').show();
element.webkitRequestFullscreen();
} else if (element.msRequestFullscreen) {
$('#bmessages').show();
element.msRequestFullscreen();
} else {
console.log("Fullscreen Unavailable");
}
}
但是我无法捕获ESC或Deny事件所以我可以再次隐藏那个div?请告知我必须做什么?
But I am unable to capture ESC or Deny event so that I can again hide that div? Please advice what I have to do?
推荐答案
使用esc离开全屏时,Chrome不会触发按键事件。但是,会触发fullscreenchange事件。
Chrome does not fire a key event when using esc to leave fullscreen. However, a fullscreenchange event IS fired.
document.addEventListener('fullscreenchange', exitHandler);
document.addEventListener('webkitfullscreenchange', exitHandler);
document.addEventListener('mozfullscreenchange', exitHandler);
document.addEventListener('MSFullscreenChange', exitHandler);
function exitHandler() {
if (!document.fullscreenElement && !document.webkitIsFullScreen && !document.mozFullScreen && !document.msFullscreenElement) {
///fire your event
}
}
这篇关于退出全屏模式时捕获ESC事件的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文