Hasty Treat - Keyboard Events Are Surprisingly Interesting
source link: https://syntax.fm/show/325/hasty-treat-keyboard-events-are-surprisingly-interesting
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
Feb 8th, 2021
Hasty Treat - Keyboard Events Are Surprisingly Interesting
👇 Download Show✏️ Edit Show NotesIn this Hasty Treat, Scott and Wes talk about keyboard events and some of the fascinating things you can do with them!
Prismic - Sponsor
Prismic is a Headless CMS that makes it easy to build website pages as a set of components. Break pages into sections of components using React, Vue, or whatever you like. Make corresponding Slices in Prismic. Start building pages dynamically in minutes. Get started at prismic.io/syntax.
LogRocket - Sponsor
LogRocket lets you replay what users do on your site, helping you reproduce bugs and fix issues faster. It's an exception tracker, a session re-player and a performance monitor. Get 14 days free at logrocket.com/syntax.
Show Notes
03:04 - The Events
- http://keycode.info/
- keydown
- beforeInput
- Keypress - deprecated
- inputType tells you whether the event is inserting text, replacing text, inserting a line break, etc.
- keyup
- change event - only fires when you focus out
- https://github.com/w3c/uievents/issues/220
08:02 - Event meta data
"key": "c",
"keyCode": 67,
"which": 67,
"code": "KeyC",
"location": 0,
"altKey": false,
"ctrlKey": false,
"metaKey": true,
"shiftKey": false
- Others:
- .locale
- .repeat
16:46 - Media keys
18:32 - When might you use key codes?
- Space bar to stop a video on a page
- Building a game
- Making a web app feel more like an app
Links
Tweet us your tasty treats!
Recommend
About Joyk
Aggregate valuable and interesting links.
Joyk means Joy of geeK