Desplácese hasta un elemento específico en JavaScript
-
Utilice la función
scroll()
para desplazarse a un elemento en JavaScript -
Utilice la propiedad
href
para desplazarse a un elemento en JavaScript -
Utilice la función
scrollIntoView()
para desplazarse a un elemento en JavaScript
Discutiremos cómo obtener el elemento especificado en el área visible de la ventana del navegador en diferentes navegadores usando JavaScript.
Los métodos para realizar esta tarea son los siguientes.
Utilice la función scroll()
para desplazarse a un elemento en JavaScript
La función scroll()
de la interfaz del elemento se desplaza a un conjunto específico de coordenadas dentro de un elemento dado. Esto es adecuado para Chrome y Firefox y no para el resto.
window.scroll(0, findPos(document.getElementById('myDiv')));
Obtenemos el elemento requerido usando el método getElementById()
. Pasamos esto en la función scroll()
para desplazarnos al elemento requerido.
Utilice la propiedad href
para desplazarse a un elemento en JavaScript
Aquí podemos establecer el valor href
para que apunte a un ancla en la página web en JavaScript.
location.href = '#';
location.href = '#myDiv';
Aquí #myDiv
es el ID de la etiqueta <div>
requerida.
Utilice la función scrollIntoView()
para desplazarse a un elemento en JavaScript
La función scrollIntoView()
mueve el elemento suministrado a la región visible de la ventana del navegador. Esto es más adecuado para usuarios de IE, Safari y Edge.
Por ejemplo,
document.querySelector('#myDiv').scrollIntoView({behavior: 'smooth'});
La propiedad behavior
describe cómo debería verse el desplazamiento. En nuestro ejemplo, se establece en smooth
. Esta propiedad también se puede utilizar en la función scroll()
.