On THIS page, I have a div with the class of “video-wrapper” witch, upon clicking the player’s toggle full screen button, is dynamically added a “full-screen” class.
I aim to remove the “full-screen” class not only by using the toggle full screen button, but by pressing the “Esc” on the keyboard. foe this purpose I have written the code:
$(document).on('keyup',function(evt) {
if (evt.keyCode == 27 && $('.video-wrapper').hasClass('full-screen')) {
console.log(evt.keyCode);
$('.video-wrapper').removeClass("full-screen");
$('input.fullscreen').removeClass('active');
}
});
The problem is that this takes two “Esc” key strokes instead of one. The first just exists the browser’s full screen mode and the second removes the “full-screen” class.
How can I exist the browser’s full screen mode and remove the “full-screen” class with one “Esc” key stroke?