移動可能な文字が画面外に出るのを防ぐ方法

Question

現在、キーボードの矢印キーを使用して移動できるオブジェクトがありますが、オブジェクトは画面から移動します。どのようにオブジェクトをスクリーン上に残すことができますか？

$(document).ready(function(){ 

    $(document).keydown(function(key) { 
     switch(parseInt(key.which,10)) { 
      case 37: 
       $('img').animate({left: "-=30px"}, 'fast'); 
       break; 
      case 38: 
       $('img').animate({top: '-=30px'},'fast'); 
       break; 
      case 39: 
       $('img').animate({left: '+=30px'},'fast'); 
       break; 
      case 40: 
       $('img').animate({top: '+=30px'},'fast'); 
       break; 
     } 
    }); 
}); 

Answer 1

Fiddle

）アニメーション、位置（中ので、私は、アニメーションを削除しました。左は同じ古い値とleft位置の値はアニメーションのみ後に更新されている電子を与えるだろう。その場合、コードが存在していても、ピクチャはウィンドウから移動できます。アニメーションを使用する必要がある場合は、いくつかのタイムアウト機能について考える必要があります。