HTMLElement.offsetParent

  • Revision slug: DOM/element.offsetParent
  • Revision title: element.offsetParent
  • Revision id: 291376
  • Created:
  • Creator: Phrogz
  • Is current revision? No
  • Comment

Revision Content

{{ DomRef() }}

Summary

offsetParent returns a reference to the object which is the closest (nearest in the containment hierarchy) positioned containing element. If the element is non-positioned, the nearest table cell or root element (html in standards compliant mode; body in quirks rendering mode) is the offsetParent. offsetParent returns null when the element has style.display set to "none". The offsetParent is useful because offsetTop and offsetLeft are relative to its padding edge.

Syntax

parentObj = element.offsetParent

Parameters

  • parentObj is an object reference to the element in which the current element is offset.

Compatibility

This property will return null on Webkit if the element is hidden (the style.display of this element or any ancestor is "none") or if the style.position of the element itself is set to "fixed".

This property will return null on Internet Explorer (9) if the style.position of the element itself is set to "fixed". (Having display:none does not affect this browser.)

References

{{ MSDN("ms534302", "offsetParent Property") }}

Specification

DOM Level 0. Not part of specification.

CSSOM View working draft: offsetParent, offsetTop, offsetWidth, and offsetHeight attributes

{{ languages( { "fr": "fr/DOM/element.offsetParent", "pl": "pl/DOM/element.offsetParent" } ) }}

Revision Source

<p>{{ DomRef() }}</p>
<h3 id="Summary" name="Summary">Summary</h3>
<p><strong>offsetParent</strong>&nbsp;returns a reference to the object which is the closest (nearest in the containment hierarchy) positioned containing element. If the element is non-positioned, the nearest table cell or root element (<code>html</code> in standards compliant mode; <code>body</code> in quirks rendering mode) is the <strong>offsetParent</strong>. <strong>offsetParent</strong> returns null when the element has <code>style.display</code> set to "none". The <strong>offsetParent</strong> is useful because <a href="/en/DOM/element.offsetTop" title="en/DOM/element.offsetTop">offsetTop</a> and <a href="/en/DOM/element.offsetLeft" title="en/DOM/element.offsetLeft">offsetLeft</a> are relative to its padding edge.</p>
<h3 id="Syntax" name="Syntax">Syntax</h3>
<pre class="eval">
<em>parentObj</em> = element.offsetParent
</pre>
<h3 id="Parameters" name="Parameters">Parameters</h3>
<ul>
  <li><code>parentObj</code> is an object reference to the element in which the current element is offset.</li>
</ul>
<h3 id="Compatibility" name="Compatibility">Compatibility</h3>
<p>This property will return <code>null</code> on Webkit if the element is hidden (the <code>style.display</code> of this element or any ancestor is <code>"none"</code>) or if the <code>style.position</code> of the element itself is set to <code>"fixed"</code>.</p>
<p>This property will return <code>null</code> on Internet Explorer (9) if the <code>style.position</code> of the element itself is set to <code>"fixed"</code>. (Having <code>display:none</code> does not affect this browser.)</p>
<h3 id="Specification" name="Specification">References</h3>
<p>{{ MSDN("ms534302", "offsetParent Property") }}</p>
<h3 id="Specification" name="Specification">Specification</h3>
<p>DOM Level 0. <em>Not part of specification.</em></p>
<p><a class="external" href="http://www.w3.org/TR/cssom-view/#offset-attributes" title="http://www.w3.org/TR/cssom-view/#offset-attributes">CSSOM View working draft: offsetParent, offsetTop, offsetWidth, and offsetHeight attributes</a></p>
<p>{{ languages( { "fr": "fr/DOM/element.offsetParent", "pl": "pl/DOM/element.offsetParent" } ) }}</p>
Revert to this revision