accessing escape key when mozilla is in full screen

问题

Not able to override firefox's escape key functionality when firefox is in full screen mode. Is it normal? Here is my code to cancel fullscreen on button click:

function cancelFullscreen() { if(document.cancelFullScreen) { document.cancelFullScreen(); } else if(document.mozCancelFullScreen) { document.mozCancelFullScreen(); } else if(document.webkitCancelFullScreen) { document.webkitCancelFullScreen(); } }

Works fine on all browsers expect mozilla, can't seem to override or do a keyup for escape key.

回答1:

I ran into a similar problem while setting up a full screen video player. It appears that Firefox reserves the escape key and will not let you override or change its functionality using keydown, keyup, or keypress.

However you can add an event listener and add functions when the screen toggles from full screen to non-full screen like so:

function isFullScreen() {
    // do stuff for full screen
}

function notFullScreen() {
    // do stuff for non-full screen
}

document.addEventListener("mozfullscreenchange", function () {
    (document.mozFullScreen) ? isFullScreen() : notFullScreen();
}, false);

Or without the ternary operator like so:

document.addEventListener("mozfullscreenchange", function () {
    if (document.mozFullScreen) {
        isFullScreen();
    } else {
        notFullScreen();
    }
}, false);

回答2:

Try this logic on keypress and keydown instead:

(function() {
    function cancelFullScreen(event) {
        if (event.keyCode == 27 )       
        {
            event.cancelBubble = true;
            event.stopPropagation();            
            return false;
        }
    }

    window.addEventListener('keypress', cancelFullScreen, true);
    window.addEventListener('keydown', cancelFullScreen, true);
})();

回答3:

$(window).resize(function(){
if (window.navigator.standalone || (document.fullScreenElement && document.fullScreenElement !=null) || (document.mozFullScreen || document.webkitIsFullScreen) || (!window.screenTop && !window.screenY)){
}else{
    // my code went here
}
});

This solved my problem.

来源：https://stackoverflow.com/questions/18982618/accessing-escape-key-when-mozilla-is-in-full-screen

标签

javascript

jquery

firefox