ویژگی scrollY Window

تعریف و استفاده

scrollY ویژگی پیکسل‌هایی که مستند از گوشه بالا چپ پنجره می‌چرخد را برمی‌گرداند.

scrollY ویژگی فقط خواندنی است.

نشانگر

scrollY ویژگی برابر است با ویژگی pageYOffset استفاده کنید.

برای سازگاری بین مرورگرها، از ویژگی window.pageYOffset به جای window.scrollY.

لطفاً ببینید:

ویژگی pageXOffset

ویژگی pageYOffset

مثال

مثال 1

محتوای را به میزان 100 پیکسل چرخانید و scrollX و scrollY را نمایش دهید:

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

به طور شخصی امتحان کنید

مثال 2

ایجاد ناوبری چسبنده:

// ناوبری را بدست آورید
const navbar = document.getElementById("navbar");
// موقعیت جابجایی ناوبری را بدست آورید
const sticky = navbar.offsetTop;
// زمانی که به موقعیت چرخش آن می‌رسید، کلاس sticky را به ناوبری اضافه کنید. زمانی که از موقعیت چرخش خارج می‌شوید، کلاس sticky را حذف کنید.
function myFunction() {
  if (window.scrollY >= sticky) {
    navbar.classList.add("sticky")
  } else {
    navbar.classList.remove("sticky");
  }
}

به طور شخصی امتحان کنید

نحوه استفاده

window.scrollY

یا:

scrollY

مقدار بازگشتی

نوع توضیح
عدد عدد پیکسل‌هایی که مستند از گوشه بالا چپ پنجره می‌چرخد.

پشتیبانی از مرورگر

جميع المتصفحات تدعم window.scrollY:

Chrome IE Edge Firefox Safari Opera
Chrome IE Edge Firefox Safari Opera
الدعم 9-11 الدعم الدعم الدعم الدعم