HTMLElement.offsetTop

  • Revision slug: Web/API/HTMLElement.offsetTop
  • Revision title: element.offsetTop
  • Revision id: 437369
  • Created:
  • Creator: teoli
  • Is current revision? No
  • Comment Moved From Web/API/element.offsetTop to Web/API/HTMLElement.offsetTop

Revision Content

{{DomRef}}

Summary

offsetTop returns the distance of the current element relative to the top of the {{domxref("element.offsetParent","offsetParent")}} node.

Syntax

topPos = element.offsetTop;

Parameters

  • topPos is the number of pixels from the top of the parent element.

Example

var d = document.getElementById("div1");
var topPos = d.offsetTop;
 
if (topPos > 10) {
  // object is offset more
  // than 10 pixels from its parent
}

Specification

{{DOM0}}

offsetLeft, offsetTop and offsetParent made their way into the CSSOM View Module (still a draft)

See also

  • {{MSDN("ms534303", "offsetTop Property")}}

Revision Source

<div>
  {{DomRef}}</div>
<h2 id="Summary" name="Summary">Summary</h2>
<p><code>offsetTop</code> returns the distance of the current element relative to the top of the {{domxref("element.offsetParent","offsetParent")}} node.</p>
<h2 id="Syntax" name="Syntax">Syntax</h2>
<pre class="syntaxbox">
<var>topPos</var> = element.offsetTop;
</pre>
<h3 id="Parameters" name="Parameters">Parameters</h3>
<ul>
  <li><code>topPos</code> is the number of pixels from the top of the parent element.</li>
</ul>
<h2 id="Example" name="Example">Example</h2>
<pre class="brush:js">
var d = document.getElementById("div1");
var topPos = d.offsetTop;
 
if (topPos &gt; 10) {
  // object is offset more
  // than 10 pixels from its parent
}</pre>
<h2 id="Specification" name="Specification">Specification</h2>
<p>{{DOM0}}</p>
<p><code>offsetLeft</code>, <code>offsetTop</code> and <code>offsetParent</code> made their way into the <a href="http://dev.w3.org/csswg/cssom-view/" title="http://dev.w3.org/csswg/cssom-view/">CSSOM View Module</a> (still a draft)</p>
<h2 id="See_also" name="See_also">See also</h2>
<ul>
  <li>{{MSDN("ms534303", "offsetTop Property")}}</li>
</ul>
Revert to this revision