Element.scrollIntoView()

Esta tradução está incompleta. Ajude a traduzir este artigo em inglês

Esta é uma tecnologia experimental
Verifique a tabela de compatibilidade entre Navegadores cuidadosamente antes de usar essa funcionalidade em produção.

O método Element.scrollIntoView() move o elemento ao qual é aplicado para a área visível da janela do navegador.

Sintaxe

element.scrollIntoView(); // Equivalente a element.scrollIntoView(true)
element.scrollIntoView(alignToTop); // Argumentos booleanos
element.scrollIntoView(scrollIntoViewOptions); // argumento Objeto

Parâmetros

alignToTop Optional
É um valor Boolean:
  • Se true, a parte superior do elemento ficará alinhada com o topo da área visível do elemento-pai. Correponde a scrollIntoViewOptions: {block: "start", inline: "nearest"}. Este é o valor default.
  • Se false, a parte inferior do elemento ficará alinhada com o fundo da área visível do elemento-pai. Corresponde a scrollIntoViewOptions: {block: "end", inline: "nearest"}
scrollIntoViewOptions Optional
Um booleano ou um objeto com as seguintes opções:
{
  behavior: "auto"  | "instant" | "smooth",
  block:    "start" | "center" | "end" | "nearest",
  inline:   "start" | "center" | "end" | "nearest"
}
Caso seja um valor booleano, true corresponde a {block: "start"} e false a {block: "end"}.

Exemplo

var element = document.getElementById("box");

element.scrollIntoView();
element.scrollIntoView(false);
element.scrollIntoView({block: "end"});
element.scrollIntoView({block: "end", behavior: "smooth"});

Observações

O elemento poderá não ser movido completamento ao topo ou ao fundo dependendo de sua composição com outros elementos.

Especificações

Especificação Status Comentário
CSS Object Model (CSSOM) View Module
The definition of 'Element.scrollIntoView()' in that specification.		 Rascunho atual Definição inicial

Compatibilidade com navegadores

Estamos convertendo nossos dados de compatibilidade para o formato JSON. Esta tabela de compatibilidade ainda usa o formato antigo, pois ainda não convertemos os dados que ela contém. Descubra como você pode ajudar!
Característica Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Basic support 29[1] 1.0 (1.7 or earlier) 8[1] 38[1] 5.0[1]
scrollIntoViewOptions Não suportado 36 (36) Não suportado Não suportado Não suportado
Característica Android Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile
Basic support 4.3[1] 1.0 (1.0) ? Não suportado 5.0[1]
scrollIntoViewOptions Não suportado 36.0 (36) ? Não suportado Não suportado

[1] Aceita scrollIntoView com um parâmetro booleano, mas não a opção de comportamento smooth

Veja também