You've attached the keyup event handler to the slideshow wrapper, so that would need to have focus for the handler to be fired. Attach it to document instead. Also, use which
instead of keycode...
$(function() {
$('.slideshow').cycle({
fx:'scrollHorz',
easing:'easeInOutCirc',
speed:700,
timeout:5000,
pager:'.slideshow_wrapper .slideshow-paging'
});
$('.slideshow_wrapper').mouseenter(function(){
$('.slideshow').cycle('pause');
}).mouseleave(function(){
$('.slideshow').cycle('resume');
})
$(document).keyup(function(e) {
if(e.which == 37)
$('.slideshow').cycle('prev');
if(e.which == 39)
$('.slideshow').cycle('next');
});
});
Also, depending on what version of jQuery you are using, you will probably be better off using on
to assign event handlers...
$(function() {
$('.slideshow').cycle({
fx:'scrollHorz',
easing:'easeInOutCirc',
speed:700,
timeout:5000,
pager:'.slideshow_wrapper .slideshow-paging'
});
$('.slideshow_wrapper').on("mouseenter", function(){
$('.slideshow').cycle('pause');
}).on("mouseleave", function(){
$('.slideshow').cycle('resume');
})
$(document).on("keyup", function(e) {
if(e.which == 37)
$('.slideshow').cycle('prev');
if(e.which == 39)
$('.slideshow').cycle('next');
});
});