Is there a way to access the "media keys" with Javascript from within a browser tab/window?
I am mainly interested in a google chrome solution.
Using the following code, there doesn't seem to be an event generated for the media keys:
<html> <body onKeyDown="showKeyCode(event)"> <script type="text/javascript"> function showKeyCode(event) { alert(event.keyCode); } </script> </body> </html>
Am I missing something? Could I do better with a Google Chrome extension??
Update: to address this problem I crafted the following tools:
Using your media keys should be simple: Just press them. For example, if you're playing a YouTube video and it's hidden in a background tab somewhere, you can press the Play/Pause key on your keyboard to pause it and press the key again to resume it.
For this case, in the Chrome address bar, type chrome://flags , and search for "key", or just copy this link into Chrome: chrome://flags/#hardware-media-key-handling. You'll see the hidden Hardware Media Key Handling option. Set this to Disabled.
Ctrl + Shift + Alt + ← sends Volume Down. Ctrl + Shift + Alt + ↓ sends Mute. Ctrl + Shift + Alt + → sends Volume Up.
As of Chrome 73, there's explicit support for media keys, see https://developers.google.com/web/updates/2019/02/chrome-73-media-updates
In summary, you can install an event handler with
navigator.mediaSession.setActionHandler('previoustrack', function() { // User hit "Previous Track" key. });
The document above gives a good overview.
https://googlechrome.github.io/samples/media-session/ has example code and a demo.
https://developer.mozilla.org/en-US/docs/Web/API/Media_Session_API has more detailed documentation.
The answer from Thakis appears to be the most current.
Outdated Answer from a decade ago:
Here's a list of key codes from Microsoft; they include keys such as "VK_VOLUME_MUTE". The key code for VK_VOLUME_MUTE is listed as 0xAD. 0xAD is decimal is 173.
And sure enough, when I load the following and hit the mute button on my keyboard, the key code reported is 173. So they do work like any other key; it wouldn't surprise me, though, if the key codes are Windows-specific. It may take some experimenting.
<html> <body> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> <script> $(document).ready(function() { $(document).keydown(function(ev){ alert(ev.keyCode); }); }); </script> </body> </html>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With