Join MDN and developers like you at Mozilla's View Source conference, 12-14 September in Berlin, Germany. Learn more at https://viewsourceconf.org

element.offsetLeft

UWAGA: Tłumaczenie tej strony nie zostało zakończone.
Może być ona niekompletna lub wymagać korekty.
Chcesz pomóc? | Dokończ tłumaczenie | Sprawdź ortografię | Więcej takich stron+.

Podsumowanie

Zwraca ilość pikseli, jaką dzieli górny lewy róg bieżącego elementu od lewej strony wewnątrz węzła offsetParent.

Składnia

left =element.offsetLeft;

left jest liczbą całkowitą reprezentująca przesunięcie od lewej strony podane w pikselach.

Uwaga

offsetLeft returns the position the upper left edge of the element; not necessarily the 'real' left edge of the element. This is important for inline elements (such as span) in flowed text that wraps from one line to the next. The span may start in the middle of the line and wrap around to the beginning of the next line. The offsetLeft will refer to the left edge of the start of the span, not the left edge of text at the start of the second line. Therefore, a box with the left, top, width and height of offsetLeft, offsetTop, offsetWidth and offsetHeight will not be a bounding box for a span with wrapped text. (And, I can't figure out how to find the leftmost edge of such a span, sigh.)

Przykład

var colorTable = document.getElementById("t1");
var tOLeft = colorTable.offsetLeft;
 
if (tOLeft > 5) {
  // duże lewe przesunięcie: zrób coś tutaj
}

Przykład

Per the note above, this example shows a 'long' sentence that wraps within a div with a blue border, and a red box that one might think should describe the boundaries of the span.

Image:offsetLeft.jpg

Note: This is an image of the example, not a live rendering in the browser. This was done because script elements can't be included in the wiki page.

<div style="width: 300px; border-color:blue;
  border-style:solid; border-width:1;">
  <span>Short span. </span>
  <span id="long">Long span that wraps withing this div.</span>
</div>

<div id="box" style="position: absolute; border-color: red;
  border-width: 1; border-style: solid; z-index: 10">
</div>

<script>
  var box = document.getElementById("box");
  var long = document.getElementById("long");
  box.style.left = long.offsetLeft + document.body.scrollLeft;
  box.style.top = long.offsetTop + document.body.scrollTop;
  box.style.width = long.offsetWidth;
  box.style.height = long.offsetHeight;
</script> 

Zobacz także

offsetParent, offsetTop, offsetWidth, offsetHeight

Specyfikacja

Niestandardowa własność.

MSDN: offsetLeft

 

Autorzy i etykiety dokumentu

 Autorzy tej strony: teoli, khalid32, Diablownik, Mgjbot, Ptak82
 Ostatnia aktualizacja: khalid32,