English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

jQuery scrollTop() 方法

jQuery HTML/CSS Methoden

scrollTop()方法获取或设置所选元素的垂直滚动条位置。

当使用scrollTop()方法获取位置时,它返回第一个选定元素的滚动条的垂直位置。

当使用scrollTop()方法设置位置时,它将为所有选定元素设置滚动条的垂直位置。

语法:

获取垂直滚动条位置:

$(selector).scrollTop()

设置垂直滚动条位置:

$(selector).scrollTop(value)

实例

获取DIV的scrollTop:

$("div").scroll(function(){
  $(this).scrollTop();
});
Testen Sie heraus‹/›

设置DIV的scrollTop:

$("button").click(function(){
  $("div").scrollTop(150);
});
Testen Sie heraus‹/›

Setzen Sie den scrollTop des Dokuments:

$("button").click(function(){
  $(document).scrollTop(400);
});
Testen Sie heraus‹/›

Fügen Sie beim Scrollen der Benutzer durch die Seite einen glatten Scrollen hinzu:

let size = $(".main").height(); // Die Höhe von ".main" ermitteln
$(window).keydown(function(event) {
  if(event.which === 40) { // Wenn die Pfeiltaste nach unten gedrückt wird
    $("html, body").animate({scrollTop: "+=" + size}, 300);
  } else if(event.which === 38) { // Wenn die Pfeiltaste nach oben gedrückt wird
    $("html, body").animate({scrollTop: "-=" + size}, 300);
  }
});
Testen Sie heraus‹/›

Parameterwert

ParameterBeschreibung
valueEine Ganzzahl, die die neue Position des Rollbalkens angibt, auf die der Wert gesetzt werden soll

jQuery HTML/CSS Methoden