Javascript DOM HTML Element offsetParent Property

Introduction

The offsetParent property returns the nearest ancestor with non-static position.

Get the offsetParent for a <div> element:

Click the button to get the offsetParent for the test div.

View in separate window

<!DOCTYPE html>
<html>
<body>
<div id="test">
  
  <p><button onclick="myFunction()">Test</button></p>
  <p>offsetParent is: <span id="demo"></span></p>
</div>/*from  w ww.j a  va2 s .  c  o  m*/

<script>
function myFunction() {
  var testDiv = document.getElementById("test");
  document.getElementById("demo").innerHTML = testDiv.offsetParent;
}
</script>

</body>
</html>

offsetParent is used with the offsetLeft, and offsetTop properties.

offsetParent will return null if the element is set to display="none".

Return the offsetParent of an element:

The offsetParent property returns a Node object representing nearest positioned ancestor.




PreviousNext

Related