HTML DOM scrollTop Propiedad

元素对象参考手册Objeto de elemento

Ejemplo

Desliza la barra de desplazamiento para obtener la distancia desde la barra de desplazamiento del elemento hasta el borde izquierdo o superior del elemento:

const element = document.getElementById("myDIV"); let x = elmnt.scrollLeft; let y = elmnt.scrollTop;

Pruébalo »

Definición y uso

La propiedad scrollTop puede obtener o establecer el número de píxeles que el contenido de un elemento se desplaza verticalmente.

El valor scrollTop de un elemento es la medida de la distancia desde la parte superior (enrollada) del contenido de este elemento hasta la parte superior del contenido visible de su viewport. Cuando el contenido de un elemento no produce una barra de desplazamiento vertical, su valor scrollTop es 0.

En sistemas con escala de visualización, scrollTop puede proporcionar un decimal.

Soporte del navegador

Propiedad
scrollTop Yes Yes Yes Yes Yes

Sintaxis

Obtener el valor de la propiedad scrollTop:

// 获得滚动的像素数
var intElemScrollTop = element.scrollTop

intElemScrollTop es un número entero, es decir, el número de píxeles que el contenido del elemento se ha desplazado hacia arriba.

Establecer el valor de la propiedad scrollLeft:

// 设置滚动的距离
element.scrollTop = intValue;

scrollTop puede ser cualquier número entero, sin embargo:

  • Si un elemento no se puede desplazar (por ejemplo, no tiene desbordamiento, o el elemento tiene una "non-scrollable"propiedad),scrollTopse establecerá en0。
  • EstablecerscrollTopsi el valor es menor que 0,scrollTopse establece en0
  • Si se establece un valor que excede el valor desplazable de este contenedor,scrollTopse establecerá en el valor máximo.

Detalles técnicos

Valor de retorno: Devuelve un número entero que representa el número de píxeles que el contenido del elemento se desplaza verticalmente.

Más ejemplos

Ejemplo

Establecer que el elemento con ID "myDIV" se desplace 50 píxeles en dirección horizontal y 10 píxeles en dirección vertical:

const element = document.getElementById("myDIV"); element.scrollLeft = 50; element.scrollTop = 10;

Pruébalo »

Ejemplo

Establecer que el elemento con ID "myDIV" se desplace 50 píxeles horizontalmente y 10 píxeles verticalmente en cada clic de botón:

var elmnt = document.getElementById("content"); function getFunction() { var x = elmnt.scrollWidth; var y = elmnt.scrollHeight; } function setFunction() { elmnt.style.height = y.scrollHeight + "px"; elmnt.style.width = y.scrollWidth + "px"; }

Pruébalo »

元素对象参考手册Objeto de elemento

Otras extensiones