在幻灯片上添加按键

Question

我目前正在使用 http://www.latercode.com/simple-slideshow/

我尝试通过按键（左/右键）来导航幻灯片。

请问有什么建议吗？

$('.ppt li:gt(0)').hide();$('.ppt li:last').addClass('last');$('.ppt li:first').addClass('first');$('#play').hide();
var cur = $('.ppt li:first');var interval;

$('#fwd').click( function() {goFwd();showPause();return false;} );
$('#back').click( function() {goBack();showPause();return false;} );
$('#stop').click( function() {stop();showPlay();return false;} );
$('#play').click( function() {start();showPause();return false;} );
function goFwd() {stop();forward();start();}
function goBack() {stop();back();start();}
function back() {cur.fadeOut( 1000 );if ( cur.attr('class') == 'first' )cur = $('.ppt li:last'); else cur = cur.prev(); cur.fadeIn( 1000 );}
function forward() { cur.fadeOut( 1000 ); if ( cur.attr('class') == 'last' ) cur = $('.ppt li:first'); else cur = cur.next(); cur.fadeIn( 1000 );}
function showPause() {$('#play').hide(); $('#stop').show(); } 
function showPlay() {$('#stop').hide();  $('#play').show(); }
function start() {interval = setInterval( "forward()", 3000 ); }
function stop() {clearInterval( interval );}
$(function() {start();} );

Answer 1

event.KeyCode 适合您的需求

检查 此 url 并在内部使用 event.KeyCode myKeyUpHandler 方法。像alert(event.KeyCode) 这样的东西应该打印出你按下的键的unicode。获取左、右、上、下的unicode，然后在case-switch语句中获取它们以调用forward() back()等等

Answer 2

您必须将功能绑定到文档的 keypress/keydown 事件（取决于浏览器，请参阅 这个其他问题），并检查按下了哪个键：

function checkKey(e){
  switch (e.keyCode) {
    case 37: //left arrow
      //back();
      break;
    case 39: //right arrow
      //next();
      break;      
  }
}

if ($.browser.mozilla) {
  $(document).keypress (checkKey);
} else {
  $(document).keydown (checkKey);
}