title: Calculate bottom left corner of a div
body: <p>How would I go about calculating the bottom left corner of a div x and y coordinates using JavaScript or jQuery.</p>
  
  <p>How would you find the bottom left corner of the green box, for example?
  HTML:</p>
  
  <pre><code>&lt;script src="//code.jquery.com/jquery-1.10.2.js"&gt;&lt;/script&gt;
  &lt;body&gt;
  &lt;div id="result"&gt;Click an element.&lt;/div&gt;
  &lt;p&gt;
    This is the best way to &lt;span&gt;find&lt;/span&gt; an offset.
  &lt;/p&gt;
  &lt;div class="abs"&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p></p>
  
  <p>CSS:</p>
  
  <pre><code>  p {
      margin-left: 10px;
      color: blue;
      width: 200px;
      cursor: pointer;
    }
    span {
      color: red;
      cursor: pointer;
    }
    div.abs {
      width: 50px;
      height: 50px;
      position: absolute;
      left: 220px;
      top: 35px;
      background-color: green;
      cursor: pointer;
    }
  </code></pre>
  
  <p>JavaScript:</p>
  
  <pre><code>$( "*", document.body ).click(function( event ) {
    var offset = $( this ).offset();
    event.stopPropagation();
    $( "#result" ).text( this.tagName +
      " coords ( " + offset.left + ", " + offset.top + " )" );
  });
  </code></pre>
  
  <p>Link to JSFiddle example: <a href="http://jsfiddle.net/hfjVQ/" rel="nofollow">http://jsfiddle.net/hfjVQ/</a></p>