using mouse left, right, up, down with galleria javascript

Question

i am playing with this library, Galleria, which is pretty neat. here is the url below:

http://devkick.com/lab/galleria/

but i can't see anyway to move from one thumbnail to another with the keyboard (right, left, etc) . . has anyone used this library and got this working?

Answer 1

$(document).bind("keydown", function(e){
  if(e.keyCode== 37){
    $.galleria.prev();
  }else if(e.keyCode== 38){
    $.galleria.next();
  }else if(e.keyCode== 39){
    $.galleria.next();
  }else if(e.keyCode== 40){
    $.galleria.prev();
  }else{
    return true;
  }
  return false;
});

It seems keypress doesn't work in IE. I changed it to keydown, which works.

I created a testpage which has been tested in IE 8, Chrome 3, Opera 10 and Firefox 3.5. It works in all of them. The testpage is based on this page with only the code above added.

Answer 2

I only bind the left and right arrows because users often use the up and down arrows for navigation but you could uncomment those lines if you want to use up and down:

<script type="text/javascript">
$(document).ready(function($) {
    $('ul.gallery_unstyled').addClass('gallery');
    $('ul.gallery').galleria({
        history: false,
        clickNext: true,
        insert: '#main_image',
        onImage: function(image, caption, thumb) {
            // add a title for the clickable image
            image.attr('title', 'Next image >>');
        }
    });
    $(document).keydown(function(e) {
    switch (e.keyCode) {
            case 37: // left arrow
            //case 38: // up arrow
                $.galleria.prev();
                break;
            case 39: // right arrow
            //case 40: // down arrow
                $.galleria.next();
                break;
        }
    });
});