Adhathomu ya scrollY ya Window

Muhtasari na matumizi

scrollY Adhathomu inaruhusu kusababisha kutumia ufunguo wa kuzingatia kwenye eneo la kina la ufunguo wa kuzingatia.

scrollY Adhathomu inaonesha kama kugwa sana.

Adhathomu

scrollY Adhathomu inaelewa kama Adhathomu ya pageYOffset Adhathomu ya pageYOffset

Kwa sababu ya muungano wa mifano ya kusababisha kutumia ufunguo wa kuzingatia, tumia: window.pageYOffset Inasababisha kuwa na window.scrollY.

Tunaelewa kwa:

Adhathomu ya pageXOffset

Adhathomu ya pageYOffset

Mfano

Mafano 1

Kusababisha kuwa na matokeo ya kusababisha kutumia ufunguo wa kuzingatia 100 pixeli, na kuonyesha scrollX na scrollY:

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

Jifunze tena

Mafano 2

Kumwambaa barani ya kina:

// Tafuta barani ya nia
const navbar = document.getElementById("navbar");
// Tafuta eneo la kusababisha kutumia ufunguo wa kuzingatia wa barani ya nia
const sticky = navbar.offsetTop;
// Kwa sababu unapokwenda eneo la kusababisha kutumia ufunguo wa kuzingatia, tafuta kufungua kiklasa "sticky" kwenye barani ya nia. Kufungua kiklasa "sticky" kwenye eneo la kusababisha kutumia ufunguo wa kuzingatia.
function myFunction() {
  if (window.scrollY >= sticky) {
    navbar.classList.add("sticky")
  }
    navbar.classList.remove("sticky");
  }
}

Jifunze tena

Mafano ya lugha

window.scrollY

Au kwenda

scrollY

Adhathomu ya kuzia

Aina Muhtasari
Adhathomu Adhathomu ya pixeli za kusababisha kutumia ufunguo wa kushika kwenye eneo la kina la ufunguo wa kuzingatia.

Mfanyiko wa inayotumia

Wote wa vifaa vya kureja vimepangia window.scrollY:

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