0

I am using the HTML5 Full-Screen API and including some content in the page. I don't want to close the full screen mode on any key clicks like ESC. Or I want to load the page again on ESC. And I tried capturing the ESC by the following code,

But When I do pressing ESC when full screen mode is active, the following function is not working. How can I disable ESC on full screen mode or do something on keydown the ESC?

$(document).ready(function (){
$(document).keydown(function(e){
    var charCode = e.charCode || e.keyCode || e.which;
    if (charCode == 27){
         alert("Escape is not allowed!");
         activateFullScreen(document.getElementById("myDiv"));
    }
});
});

function activateFullScreen(element) {
  if(element.requestFullScreen) {
    element.requestFullScreen();
  } else if(element.mozRequestFullScreen) {
    element.mozRequestFullScreen();
  } else if(element.webkitRequestFullScreen) {
    element.webkitRequestFullScreen();
  }
}

function myFunction() {
activateFullScreen(document.getElementById("myDiv"));
}

html:

<body>
<button onclick="myFunction()">Try it</button>
<div id="myDiv"> Some content here </div>
</body>
L Y E S - C H I O U K H
  • 4,765
  • 8
  • 40
  • 57
Nidheesh
  • 4,390
  • 29
  • 87
  • 150
  • 2
    https://developer.mozilla.org/en-US/docs/Web/API/Fullscreen_API#Things_your_users_want_to_know – adam-beck Apr 25 '17 at 12:06
  • 6
    You can’t stop people from leaving fullscreen. That would be a horrible security flaw. – Ry- Apr 25 '17 at 12:08
  • @Ryan I was curious about that myself. Even if it was possible, overriding the defaults (i.e. hitting ESC) would be frustrating to me as a user. – adam-beck Apr 25 '17 at 12:10
  • @Ryan.. Okay. Say someone press ESC and window closes. Shall I open it again in another second? I tried `if (charCode == 27){` to capture that event. But this seems unreachable on `ESC` – Nidheesh Apr 25 '17 at 12:16
  • 1
    The window’s not going to close; it’s going to leave fullscreen. See https://stackoverflow.com/questions/10706070/how-to-detect-when-a-page-exits-fullscreen for that event. If you have some permanent permission to fullscreen without prompting somehow, you can immediately reenter fullscreen from there. – Ry- Apr 25 '17 at 12:22

0 Answers0