Window pageYOffset 属性

定义和用法

pageYOffset 属性返回文档从窗口左上角滚动的像素。

pageYOffset 属性等于 scrollY 属性。

pageYOffset 属性是只读的。

另请参阅:

screenX 属性

screenY 属性

实例

例子 1

将内容滚动 100 像素,并提示 pageXOffset 和 pageYOffset:

window.scrollBy(100, 100);
alert(window.pageXOffset + window.pageYOffset);

亲自试一试

例子 2

创建粘性导航栏:

// 获取导航栏
const navbar = document.getElementById("navbar");
// 获取导航栏的偏移位置
const sticky = navbar.offsetTop;
// 当您到达其滚动位置时,将 sticky 类添加到导航栏。离开滚动位置时删除 sticky 类。
function myFunction() {
  if (window.pageYOffset >= sticky) {
    navbar.classList.add("sticky")
  } else {
    navbar.classList.remove("sticky");
  }
}

亲自试一试

语法

window.pageYOffset

atau:

pageYOffset

Nilai Pengembalian

Tipe Deskripsi
Angka Jumlah piksel yang digeser dokumen dari kiri atas jendela.

Dukungan Peramban

Semua peramban mendukungnya pageYOffset

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
Dukungan 9-11 Dukungan Dukungan Dukungan Dukungan