Role para elemento específico em JavaScript
-
Use a função
scroll()
para rolar até um elemento em JavaScript -
Use a propriedade
href
para rolar até um elemento em JavaScript -
Use a função
scrollIntoView()
para rolar até um elemento em JavaScript
Discutiremos como obter o elemento especificado na área visível da janela do navegador em diferentes navegadores usando JavaScript.
Os métodos para realizar essa tarefa são os seguintes.
Use a função scroll()
para rolar até um elemento em JavaScript
A função scroll()
da interface do elemento rola para um conjunto específico de coordenadas dentro de um determinado elemento. Isso é adequado para Chrome e Firefox e não para o resto.
window.scroll(0, findPos(document.getElementById('myDiv')));
Obtemos o elemento necessário usando o método getElementById()
. Passamos isso na função scroll()
para rolar até o elemento necessário.
Use a propriedade href
para rolar até um elemento em JavaScript
Aqui podemos definir o valor href
para apontar para uma âncora na página da web em JavaScript.
location.href = '#';
location.href = '#myDiv';
Aqui, #myDiv
é o ID da tag <div>
necessária.
Use a função scrollIntoView()
para rolar até um elemento em JavaScript
A função scrollIntoView()
move o elemento fornecido para a região visível da janela do navegador. Isso é mais adequado para usuários do IE, Safari e Edge.
Por exemplo,
document.querySelector('#myDiv').scrollIntoView({behavior: 'smooth'});
A propriedade behaviour
descreve como deve ser a aparência do pergaminho. Em nosso exemplo, é definido como smooth
. Esta propriedade também pode ser usada na função scroll()
.