Detaillierte Erklärung der Höhe der Browser-Bildlaufleiste in js

Der unten stehende Editor bringt Ihnen einen Artikel über die Höhe des Scrolltops der JS-Browser-Bildlaufleiste (Erklärung mit Beispielen). Der Herausgeber findet es ziemlich gut, deshalb teile ich es jetzt mit Ihnen und gebe es als Referenz. Folgen wir dem Editor, um einen Blick darauf zu werfen

1. Im JSBox-Modell haben wir zuvor gelernt: Client-Serie/Offset-Serie/ScrollWidth/ScrollHeight sind alle „schreibgeschützte“ Attribute-> ; Der Wert kann nur über Attribute ermittelt werden und der Stil des Elements kann nicht über Attribute geändert werden

2. scrollTop/scrollLeft: die Höhe/Breite der Bildlaufleiste (diese beiden Attribute sind die einzigen „lesbaren“) und beschreibbare" Attribute)

box.scrollTop = 0 // Direkt zum oberen Rand des Containers zurückkehren

Der Wert unseres scrollTop hat Grenzwerte (Maximal- und Minimalwerte) und Der von uns festgelegte Wert ist kleiner als der Mindestwert oder es ist nutzlos, wenn er größer als der Maximalwert ist. Der Effekt ist immer noch der Grenzwert

[der Mindestwert ist Null]

box.scrollTop = -1000;// Kehrt direkt zum oberen Rand des Containers zurück, ohne

console.log(box.scrollTop) //0

[Maximalwert = wahre Höhe – Die Höhe des aktuellen Containers auf einem Bildschirm]

var maxTop = box.scrollHeight - box.clientHeight;

Die klassischste Anwendung von scrollTop ist die Rückkehr nach oben. Der folgende Code lautet wie folgt:

Das obige ist der detaillierte Inhalt vonDetaillierte Erklärung der Höhe der Browser-Bildlaufleiste in js. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!