Desplazamiento de ventanaY
Ejemplo 1
Desplace el contenido 100 píxeles y avise a scrollX y scrollY:
window.scrollBy(100, 100);
alert(window.scrollX + window.scrollY);
Más ejemplos a continuación.
Definición y uso
La scrollY
propiedad devuelve los píxeles que un documento ha desplazado desde la esquina superior izquierda de la ventana.
La scrollY
propiedad es de solo lectura.
Nota
La scrollY
propiedad es igual a la
pageYOffset
propiedad.
Para compatibilidad entre navegadores, use window.pageYOffset en lugar de window.scrollY.
Ver también:
Sintaxis
window.scrollY
o solo:
scrollY
Valor devuelto
Escribe | Descripción |
Un número | El número de píxeles que el documento se ha desplazado desde la esquina superior izquierda de la ventana. |
Más ejemplos
Cree una barra de navegación pegajosa:
// Get the navbar
const navbar = document.getElementById("navbar");
// Get the offset position of the navbar
const sticky = navbar.offsetTop;
// Add the sticky class to the navbar when you reach its scroll position. Remove the sticky class when you leave the scroll position.
function myFunction() {
if (window.scrollY >= sticky) {
navbar.classList.add("sticky")
}
else {
navbar.classList.remove("sticky");
}
}
Compatibilidad con navegador
window.scrollY
es compatible con todos los navegadores:
Chrome | IE | Edge | Firefox | Safari | Opera |
Yes | 9-11 | Yes | Yes | Yes | Yes |