jQuery:一个奇怪的小问题.同时按下事件键

在jQuery/javascript方面做得不太好，但尝试创建一个小游戏。

这里是jsfiddle链接：http://jsfiddle.net/zDer5/

我正试图在div周围移动img。我成功地能够在所有方向上移动img，也可以通过按住一两个箭头键进行对角移动来对角移动img。

但问题是，如果我按住向右箭头键向右移动，在两者之间如果我按下向上键向上倾斜，现在如果我释放向上键（仍然按住向右箭头）。。。运动停止，我预计它会向右移动。

这在所有情况下都会发生。。向左按住，向上按压然后向上释放。。。运动停止。

第二：当我改变方向时，图像会停顿一秒钟。任何平稳运动的指南。

谢谢

这里是jsfiddle链接：http://jsfiddle.net/zDer5/

我也在这里粘贴相同的代码

    var keys = {};
$('body').keydown(function(event){
    keys[event.which] = true;
    moveDot();
});
$(document).keyup(function (event) {
    delete keys[event.which];
    moveDot();
});
function moveDot(){

            var html = '';
                for (var i in keys) {
                    if (!keys.hasOwnProperty(i)) continue;
                        html += '<p>' + i + '</p>';
                   if(i == '37'){
                        var left = $('#dot').css("left");
                        left = parseInt(left.match(/'d+/));
                        left = left-3;
                        $('#dot').css({ 'left': left + 'px' });
                    }
                   if(i == '38'){
                        var top = $('#dot').css("top");
                        top = parseInt(top.match(/'d+/)); 
                        top = top-3;
                        $('#dot').css({ 'top': top + 'px' });
                   }
                   if(i == '39'){
                      var left2 = $('#dot').css("left");
                        left2 = parseInt(left2.match(/'d+/)); 
                        left2 = left2+3;
                        $('#dot').css({ 'left': left2 + 'px' });
                    }
                    if(i == '40'){
                        var top2 = $('#dot').css("top");
                        top2 = parseInt(top2.match(/'d+/)); 
                        top2 = top2+3;
                        $('#dot').css({ 'top': top2 + 'px' });
                    }     
                }
                $('#out').html(html);
 }
<div id="game-panel">
     <img src="http://203.157.202.2/photos2009/Pic/thumbnails/black_dot_400x400.jpg" id="dot" />
</div>
#game-panel{ position: relative; border: 2px solid #ccc; height: 200px; }
    #game-panel img{ position:absolute; }
    #dot{ left:100px; top:100px; }