jQuery Topics

15 Keyboard Event Plugins

Today we have a collection of 15 jQuery Keyboard Event Plugins that you would definitely love integrating in your webpage! Keyboard Event’s can add further usability to websites that have high interactivity with the user or need input via the keyboard as key combinations that trigger events on the page. They could also be useful to provide quick shortcuts or for keypad entry, the list goes on. Have fun!

Related posts:

1. jwerty

Is a JS lib which allows you to bind, fire and assert key combination strings against elements and events. It normalizes the poor std api into something easy to use and clear.


jwerty

Source
Demo

2. jQuery Hotkeys

Lets you watch for keyboard events anywhere in your code supporting almost any key combination.


jQuery Hotkeys

Source
Demo

3. Keyboard

Virtual Keyboard using jQuery UI.


Keyboard

Source
Demo

4. Keyboard Smashed

A jQuery plugin to detect if a user has smashed their keyboard. This is determined by the amount of keys that are depressed which triggers the event.


Keyboard Smashed

Source
Demo

5. Piano

A flexible piano keyboard plugin for jQuery


Piano

Source
Demo

6. okShortcut

The two methods jQuery.shortcut.add and jQuery.shortcut.remove are used to add and remove key bindings, respectively. Both take a key-combination and a callback. jQuery.shortcut.add can optionally receive an options hash.


okShortcut

Source + Demo

7. jQuery Keyboard Navigation Plugin

Provides the capability for elements on a page to be navigated and activated via the keyboard’s up, down, right and left arrow keys.


jQuery Keyboard Navigation Plugin

Source + Demo

8. jQuery Keypad

A jQuery plugin that attaches a popup keyboard to a text field for mouse-driven entry or adds an inline keypad in a division or span.


jQuery Keypad

Source + Demo

9. Ctrl + Key Combination

Simple jQuery Plugin.


Ctrl + Key Combination

Source + Demo

10. jQuery Plugin: Custom Styled Select Input w/Keyboard Interaction

There are still a few minor bugs that need to be fixed but it works enough for me, one bug is that in IE you need to click in the drop-down area if you don’t want the page to jump when using the keys.


jQuery Plugin: Custom Styled Select Input w/Keyboard Interaction

Source
Demo

11. jQuery.actionsmenu-1.1

This jQuery plugin makes it easy to provide access to functions from a drop-down menu. Includes accessibility features like WAI-ARIA and keyboard support for universal access.


jQuery.actionsmenu-1.1

Source + Demo

12. Adding Keyboard Navigation

I was recently asked how keyboard navigation could be supported to move a slider backwards and forwards. I’ve created a few tutorials on how to create sliders and carousels but not mentioned keyboard supported navigation yet.


Adding Keyboard Navigation

Source
Demo

13. Keyboard Accessibility Plugin API

Makes it easy for developers to add keyboard handlers to their code without a lot of extra overhead.


Keyboard Accessibility Plugin API

Source + Demo

14. numerickeyboard.js

Is a fairly simple-minded and an extremely easy to use plugin to create numerical keyboard for input.


numerickeyboard.js

Source
Demo

15. Keyboard Links

Is a plugin which allows the user to quickly find any link on the page and click it by just using the keyboard.


Keyboard Links

Source
Demo

Read the full/original article at jQuery4u

    Related Posts

    Comments are closed.

    jQuery Resources

    Learn more about jQuery

    jQuery News & Links

    I only just found out that the jQuery validation plugins has a validation rule called “remote” which can be used ...

    jQuery function to check if horizontal scroll is present – hasHScrollBar() – (or vertical check below also, util function to ...

    jQuery function to Set any DOM Element to Top View (bring to front) using CSS Z-Index property.

    Is it possible to declare arrays in JavaScript object literal notation? Example 1 – this works with arrays Declaration: Storage ...

    To get the a variables type using jQuery there is a jQuery function called .type() which returns “array”, “string”, “number”, ...

    In this post you can find tutorials which explain step by step different API use cases with jQuery like Google ...

    For valuable work on creation of sites you need a good comfortable editor necessarily. There are many requiring paid products ...

    Today we are sharing with you a collection of awesome jQuery Camera Photo plugins. They offer a range of image ...

    Back in the day, if you saw something that was animated on a website it was automatically assumed to be ...

    In this post, we have compiled a list of 10 jQuery HTML5 Audio players available today, most allow native audio ...

    jQuery Mobile is a powerful framework for making mobile web applications. But can we use it to convert existing desktop ...

    I have jotted a quick post on a Basic JavaScript Regular Expression Example to give beginners out there a taste ...

    In April 2012′s edition of Interestingly Random JavaScript, jQuery and Web Development we bring you some very cool stuff such ...

    In this post we are sharing you a roundup of 10 really jQuery plugins as of today. Pretty cool plugins ...

    As always expected from the jQuery community, the compilation we have for you today are some good and impressive recently ...

    A collection of jQuery PNG/JPEG/GIF plugins that enables image animation, cartoon-like background, etc… let them help you design displays for ...

    A collection of JavaScript/jQuery Zip/File/Compressor plugins that allows you to minify your JS code and compress your JS files ready ...

    Quick jQuery code snippet on how to keep an element in view. For demo scroll down on any page on ...

    Here is what I think is the best and most reliable way to load jQuery library and jQuery UI Libraries. ...

    jQuery code snippet which outputs all attributes of element using the default .attr() function on any dom element(s). usage: output:

    More Links & News

    Community Resources

    Use jQuery and the Google Maps API to create your own map application.

    Super cool and easy way to get stylish tooltips with jQuery.

    The right way to include the jQuery library in WordPress.

    Share a resource