jQuery.position_3.3.1

by sanshi

HTML

<div class="container">
  <table>
    <tr>
      <td>row-1</td>
    </tr>
    <tr>
      <td id="theTD">row-2</td>
    </tr>
  </table>
</div>
<div id="result">
</div>

CSS

.container {
  background-color: lightgreen;
  padding: 50px;
  position: relative;
}

table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
  background-color: green;
}

table td {
  padding: 0;
  height: 50px;
  color: #fff;
  vertical-align: top;
}

JavaScript

$(function() {
	var tdPosition = $('#theTD').position();
	$('#result').html('top:' + tdPosition.top + ' left:' + tdPosition.left);
});