Is it possible to modify how to exit fullscreen video on a web browser?

1.9k Views Asked by At

I have a video element that can go fullscreen. Once in Fullscreen mode, I want to disable exiting fullscreen when pressing ESC. Now, I know it's technically not possible since there is no ESC keydown events dispatched in fullscreen mode BUT Chrome Remote Desktop has something that's really interesting.

Instead of Press ESC to exit fullscreen, they show Press and Hold ESC to exit fullscreen.

Does anyone know how this could be achieved? The goal is to NOT exit fullscreen on ESC keydown but exit when holding ESC.

I know Google most likely modified the behaviour of the browser for Chrome Remote Desktop but it would be cool if we could do that as well :)

Thanks

1

There are 1 best solutions below

0
On

Turns out it is a niche feature called Keyboard Lock, only available in Chrome (and Edge). If you lock the "Escape" key, Chrome understands that it needs to use "Hold Escape to Exit" instead of "Press Escape to Exit".

navigator.keyboard.lock(["Escape"]);

Unofficial draft describing this exact behaviour https://wicg.github.io/keyboard-lock/#escape-key