jQuery - 我试图将箭头键绑定到动态图片

我需要使用箭头键在屏幕上移动一个火柴人图片。我似乎无法找到如何。我试过了我发现的所有东西，但它仍然无效。这是link。jQuery - 我试图将箭头键绑定到动态图片

代码：

<script> 
    $(document).ready(function(){ 
     $('#sitting').hide(); 
      $(document).keydown(function(e){ 
       var keyCode = e.keyCode || e.which, 
        arrow = { left:37, up:38, right: 39, down: 40 }; 
       switch (keyCode { 
       case arrow.left: 
        if(!$('#sitting').is(':visible')){ 
        $('#img,#sitting').animate({ 
         left:'-=60px' 
        },300,"linear"); 
        } 
       break; 
       case arrow.up: 
       break; 
       case arrow.right: 
        if(!$('#sitting').is(':visible')){ 
        $('#img,#sitting').animate({ 
         left:'+=60px' 
        },300,"linear"); 
        } 
       break; 
       case arrow.down: 
       break; 
       } 
      }); 
     $('#sit').click(function(){ 
      $('#img').fadeToggle(-100,function(){ 
       $('#sitting').fadeToggle(-100); 
      }); 
     }); 
    }); 
    </script> 
    <button id='left'><<</button><button id='right'>>></button><button id='sit'>Sit Down/Stand up</button><br /> 
    <img src='/jquery/sprites/spritePerson.png' id='img' style='position: absolute; margin-top: 375px;' /><img id='sitting' src='/jquery/sprites/spriteSitting.png' style='position: fixed; margin-top: 375px;'><img id='tree' src='/jquery/sprites/spriteTree.png' style='position: absolute; margin-top: 100px; margin-left: 700px;' /><br />

来源

2013-02-03 hexagonest

想想你的代码中工作。只有你错过了switch (keyCode)的支架代码。

你怎么需要解决你的代码。你的一些代码可以被优化。

like。

在调用动画方法之前，始终使用stop（true）。这会停止动画队列。 like
为什么你需要制作一个新的箭头对象。你可以直接使用键码，以防万一;
对您的选择器进行引用，以便它不会遍历所有时间来获取元素。

看到的jsfiddle：http://jsfiddle.net/bxAtd/

来源

2013-02-03 04:55:22

jQuery - 我试图将箭头键绑定到动态图片

回答

相关问题