HTML5 video detect keypress in full screen mode

Question

While playing a video in full screen mode with the <video> tag in Chrome and Opera, keypress events are not being triggered.

$(document).on('keypress', function(e) {
    if (e.which == 32) {
        e.preventDefault()
        console.log('space pressed')
    }
})

With the above code, pressing space while the video is playing normally, spits out 'space pressed' in the console, but nothing happens when I switch to full screen. The code works in FF, and I haven't yet tested in Safari.

Is there any way to detect the keypress event while in full screen mode?

Answer 1

It seems that most browsers don't allow keyboard inputs while in fullscreen mode due to security reasons. Although in Chrome, i believe you can set the following for keyboard input to work:

document.documentElement.webkitRequestFullScreen(Element.ALLOW_KEYBOARD_INPUT);

I haven't tested this myself.

Also for more information check out the following:

How do I capture keyboard events while watching an HTML5 video in fullscreen mode?

Using the fullscreen API in web browsers