div boundary jQuery
<p><a href="http://jsbin.com/ofudi4/3/edit" rel="nofollow">http://jsbin.com/ofudi4/3/edit</a></p>

<p>What this code does you can test for yourselves. </p>

<p>Now my question is if i would have another div-tag around , like a frame. How would i make #moveMe to just move inside the frame div? Checking for boundaries after each move, so the figure doesn't move outside the frame. </p>

<p>Anyone now how to?</p>

<hr>

<p><em>EDIT: Adding code from link.</em></p>

<pre><code>$(document).keydown(function(e){
    // Left
    if (e.keyCode == 37) { 
      $("#moveMe").animate({marginLeft: "-=100px"}, {queue:false});
       return false;
    }
    // Top
    if (e.keyCode == 38) { 
      $("#moveMe").animate({marginTop: "-=100px"}, {queue:false});
       return false;
    }
    // Right
    if (e.keyCode == 39) { 
      $("#moveMe").animate({marginLeft: "+=100px"}, {queue:false});
       return false;
    }
    // Bottom
    if (e.keyCode == 40) { 
      $("#moveMe").animate({marginTop: "+=100px"}, {queue:false});
       return false;
    }
});
</code></pre>

<p>HTML</p>

<pre><code>&lt;body&gt;
  &lt;div id="moveMe"&gt;&lt;/div&gt;
&lt;/body&gt;
</code></pre>
