Properti scrollY Window

Definisi dan penggunaan

scrollY Properti mengembalikan pixel bergerak dari atas kiri jendela dokumen.

scrollY Properti adalah hanya-baca.

Pesan

scrollY properti setara Properti pageYOffset properti.

Untuk kompatibilitas browser, gunakan window.pageYOffset Daripada window.scrollY.

Lihat pula:

Properti pageXOffset

Properti pageYOffset

Contoh

Contoh 1

Gulir konten 100 pixel, dan tampilkan scrollX dan scrollY:

window.scrollBy(100, 100);
alert(window.scrollX + window.scrollY);

Coba sendiri

Contoh 2

Buat navigasi yang menempel:

// Dapatkan navigasi
const navbar = document.getElementById("navbar");
// Dapatkan posisi offset navigasi
const sticky = navbar.offsetTop;
// Saat Anda mencapai posisi gerakan, tambahkan kelas sticky ke navigasi. Hapus kelas sticky saat meninggalkan posisi gerakan.
function myFunction() {
  if (window.scrollY >= sticky) {
    navbar.classList.add("sticky")
  } else {
    navbar.classList.remove("sticky");
  }
}

Coba sendiri

Sintaksis

window.scrollY

atau:

scrollY

Nilai kembalian

Tipe Deskripsi
Angka Pixel bergerak dari atas kiri jendela dokumen.

Perangkat lunak penggunaan

Semua peramban mendukung window.scrollY：

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