Atributo offsetLeft do Elemento DOM HTML

Definição e uso

offsetLeft O atributo retorna a posição esquerda em relação ao pai (em pixels). Este atributo é de leitura.

O valor de retorno inclui:

  • Posição esquerda do elemento e margem
  • Margem esquerda interna do pai, barra de rolagem e borda

Veja também:Tutorial do modelo de caixa CSS

offsetParent

Todos os elementos de bloco relatam o deslocamento em relação ao pai de offset:

  • offsetTop
  • offsetLeft
  • offsetWidth
  • offsetHeight

O pai de offset é o ancestral mais próximo com posição não estática.

Se o pai de offset não existir, o deslocamento é em relação ao corpo do documento.

Veja também:

Atributo offsetTop

Atributo offsetWidth

Atributo offsetHeight

Atributo offsetParent

Atributo clientTop

Atributo clientLeft

Atributo clientWidth

Atributo clientHeight

Exemplo

Exemplo 1

Obter a posição offsetLeft de "myDIV":

const element = document.getElementById("myDIV");
let pos = element.offsetLeft;

Experimente você mesmo

Exemplo 2

Obter a posição de "myDIV":

const element = document.getElementById("myDIV");
let pos1 = element.offsetTop;
let pos2 = element.offsetLeft;

Experimente você mesmo

Sintaxe

Retorna a posição esquerda:

element.offsetLeft

Retorno

Tipo Descrição
Número A posição esquerda do elemento, em pixels.

Suporte do navegador

Todos os navegadores suportam element.offsetTop:

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
Suporte Suporte Suporte Suporte Suporte Suporte