Navigation with the “j” and “k” keys

If you are using Vim you already know the meaning of the “j” and “k” keys: they navigate one line downwards resp. upwards. Some websites like The Big Picture adopted this functionality to provide an easy way to navigate, in the case of The Big Picture to jump from photo to photo.

As I wanted to use the same functionality and didn’t find an existing solution I wrote a simple jQuery plugin for this purpose: jquery-jknavigable. Its usage is pretty simple, to make the posts of a blog navigable with the “j” and “k” keys you would use the following code:

$('.post').jknavigable();

By default the active element is marked with the class “active” so you can style it differently. If necessary, you can specify your own class name:

$('.post').jknavigable({'activeClass': 'someClass'});

That’s it. Feedback is, as always, welcome.

PS: a good starting point for writing your own plugin is jQuery’s Plugin Authoring page.