Prevent Esc Key From Exiting FullScreen App Mode On Website

I'm developing a custom 'lightbox' photo gallery. I'm adding key event 'listeners' (left>prev, right>next, esc>close), and I'm having the issue of Safari (or any fullscree

Solution 1:

Practically you cannot disable ESC key for browsers as that is a compromise for user to at least have some control over their browser. However, you do have a way to bind an eventlistener to your element field (say your lightbox div) to catch the Event when Esc is pressed and suppress it, like below: (so when people press ESC over the gallery div it will not exit browser fullscreen)

document.querySelector("div.lightbox").addEventListener("keydown",function(e){
    var charCode = e.charCode || e.keyCode || e.which;
    if (charCode == 27){
         alert("Escape is not suppressed for lightbox!");
        return false;
    }
});

Also many browsers toggle fullscreen mode with F11 key now.