title: Jquery Game - how to keep object inside bounds
body: <p>I wanted to get a feel of a simple jquery game so I pulled an example to test.
  The soldier would move prior to changing the following:</p>
  
  <p><strong>Initally was:</strong></p>
  
  <pre><code>&lt;p&gt;&lt;img id="soldier" style="left: 50px; position: absolute; top: 250px" 
  height=90 width=100 border=0 hspace=0 src="soldier.jpg"/&gt;&lt;/p&gt;
  </code></pre>
  
  <p><strong>Now is:</strong></p>
  
  <pre><code>&lt;p&gt;&lt;img id='soldier' src='soldier.jpg'&gt;&lt;/p&gt;
  </code></pre>
  
  <p>css:</p>
  
  <pre><code>#soldier {z-index: 0; left: 100px; top: 250px; height:90px; width:100px; border:0;}
  </code></pre>
  
  <p><strong>----------------------------------------------------------------------------------------------------------------------------------</strong></p>
  
  <p>The issue I have(aside the recent image position change above) I get an error that says:</p>
  
  <pre><code>Uncaught ReferenceError: $ is not defined
  </code></pre>
  
  <p>for line:</p>
  
  <pre><code>var maxLeft = parseInt($("#box").css('width')) -parseInt($("#box").css('border-left-width')) - parseInt($("#soldier").width());
  </code></pre>
  
  <p>for the soldier's height. I am using a format that I have used in a past program <strong>but neither format of:</strong></p>
  
  <pre><code>var maxLeft = parseInt($("#box").css('width')) -parseInt($("#box").css('border-left-width')) - parseInt($("#soldier").width());
  </code></pre>
  
  <p>OR</p>
  
  <pre><code>var maxLeft = parseInt($("#box").css('width')) -parseInt($("#box").css('border-left-width')) - parseInt(obj.css("width"));
  </code></pre>
  
  <p>works. I want to keep my soldier within the box while the user moves him. </p>
  
  <p><a href="https://jsfiddle.net/W4Km8/4990/" rel="nofollow noreferrer">https://jsfiddle.net/W4Km8/4990/</a></p>
  
  <p>The movements is found in my first function moveObj</p>
  
  <p><img src="https://i.stack.imgur.com/7EKWJ.jpg" alt="enter image description here"></p>
  
  <p>My error:</p>
  
  <p><img src="https://i.stack.imgur.com/me4cH.jpg" alt="enter image description here"></p>