JavaScript ja sivun vieritys

Anonyymi

Tässä alla on vierityksen Y-position tulostus console ikkunaan, mutta kuinka tunnistan että vieritystä ei voi pidemmälle jatkaa, onko jotain muuttujaa johon tuota scrollY arvoa verraten tunnistaisi sivun lopun saavutetuksi.

window.addEventListener('scroll', function(e) {
console.log(window.scrollY);
});

10

174

    Vastaukset

    Anonyymi (Kirjaudu / Rekisteröidy)
    5000
    • Anonyymi

      Skrollattavan elementin korkeus on: document.documentElement.scrollHeight
      Ja ikkunan näkyvän osan korkeus: window.innerHeight

      Noiden avulla saat varmaan laskettua.

      • Anonyymi

        Miten tuo pitäisi laskea, ( window.scrollY ) on paljon pienempi arvo kuin ( document.documentElement.scrollHeight )


      • Anonyymi

        1370 = document.documentElement.scrollHeight
        468 = window.scrollY


      • Anonyymi
        Anonyymi kirjoitti:

        Miten tuo pitäisi laskea, ( window.scrollY ) on paljon pienempi arvo kuin ( document.documentElement.scrollHeight )

        Kun window.innerHeight window.scrollY on melkein tai tasan document.documentElement.scrollHeight ollaan alalaidassa.

        Logita konsoliin ja vierittele edestakaisin, niin ymmärrät varmaan logiikan.

        console.log(document.documentElement.scrollHeight,window.innerHeight,window.scrollY);


      • Anonyymi
        Anonyymi kirjoitti:

        Kun window.innerHeight window.scrollY on melkein tai tasan document.documentElement.scrollHeight ollaan alalaidassa.

        Logita konsoliin ja vierittele edestakaisin, niin ymmärrät varmaan logiikan.

        console.log(document.documentElement.scrollHeight,window.innerHeight,window.scrollY);

        Kumpa ne ei mene lähellekkään tasan kuten edellä jo kerroin, eli silloin kun ollaan sivun alalaidassa on arvot nämä:

        1370 = document.documentElement.scrollHeight
        468 = window.scrollY


      • Anonyymi
        Anonyymi kirjoitti:

        Kun window.innerHeight window.scrollY on melkein tai tasan document.documentElement.scrollHeight ollaan alalaidassa.

        Logita konsoliin ja vierittele edestakaisin, niin ymmärrät varmaan logiikan.

        console.log(document.documentElement.scrollHeight,window.innerHeight,window.scrollY);

        Ja tämä antamasi arvojen tulostus palauttaa arvot

        console.log(document.documentElement.scrollHeight,window.innerHeight,window.scrollY);

        2196 = document.documentElement.scrollHeight
        902 = window.innerHeight
        1274 = window.scrollY


      • Anonyymi
        Anonyymi kirjoitti:

        Kumpa ne ei mene lähellekkään tasan kuten edellä jo kerroin, eli silloin kun ollaan sivun alalaidassa on arvot nämä:

        1370 = document.documentElement.scrollHeight
        468 = window.scrollY

        Testasin lokituksella (keskimmäinen luku siis summa)
        console.log(document.documentElement.scrollHeight,window.innerHeight window.scrollY,window.scrollY);

        Skrollatessa ylhäältä alas:

        123 95 1
        123 97 3
        123 98 4
        123 102 8
        123 106 12
        123 109 15
        123 111 17
        123 116 22
        123 118 24
        123 119 25
        123 121 27
        123 122 28
        123 123 29

        Eli toimii kuten aiemmin kerroin.


      • Anonyymi
        Anonyymi kirjoitti:

        Testasin lokituksella (keskimmäinen luku siis summa)
        console.log(document.documentElement.scrollHeight,window.innerHeight window.scrollY,window.scrollY);

        Skrollatessa ylhäältä alas:

        123 95 1
        123 97 3
        123 98 4
        123 102 8
        123 106 12
        123 109 15
        123 111 17
        123 116 22
        123 118 24
        123 119 25
        123 121 27
        123 122 28
        123 123 29

        Eli toimii kuten aiemmin kerroin.

        Eikun just niin, hyvä, toimiihan tuo, jäi tuo PLUS merkki pois välistä.


      • Anonyymi
        Anonyymi kirjoitti:

        Eikun just niin, hyvä, toimiihan tuo, jäi tuo PLUS merkki pois välistä.

        Hyvä, KIITOS


      • Anonyymi
        Anonyymi kirjoitti:

        Ja tämä antamasi arvojen tulostus palauttaa arvot

        console.log(document.documentElement.scrollHeight,window.innerHeight,window.scrollY);

        2196 = document.documentElement.scrollHeight
        902 = window.innerHeight
        1274 = window.scrollY

        Jos tuossa oli skrollattu alalaitaan, niin summa on silloin 2176, eli melkein tuo elementin korkeus. Se ei välttämätä aina skrollaudu ihan pikselilleen riippuen mistä roikkuu, joten pitää verrata vaikka 0,99x:ään korkeudesta.


    Ketjusta on poistettu 0 sääntöjenvastaista viestiä.

    Luetuimmat keskustelut

    1. Kun väestö ikääntyy ja veronmaksajat vähenee, mitä sitten vasemmistolaiset?

      Maahanmuutto ei vaan ole ratkaisu väestön ikääntymiseen. Maahanmuutto lykkää ja hidastaa väestön ikääntymistä ja työv
      Maailman menoa
      199
      4303
    2. "Mitä sä nainen tuot sitten pöytään" ?

      Jos mies provaidaa ja suojelee... Pitääkö miesten kysyä tuollaisia?
      Ikävä
      99
      2853
    3. Ekologinen kommunismi tulee voittamaan fossiilikapitalismin

      Kiina on mahtitekijä uusiutuvien energialähteiden kehityksessä, ja Trump osoitus viimeisestä öljyn perään itkemisestä, m
      Maailman menoa
      20
      2816
    4. Minja jytkyttää vas.liiton kannatusta ylöspäin

      Alkaa raavaat duunarimiehetkin palaamaan vasemmistoliiton kannattajiksi. Eduskunnassahan on vain kaksi työntekijöiden p
      Maailman menoa
      89
      2626
    5. Aktivistinainen pysäytti ICE-agentin luodin päällään USA:ssa!

      Video ampumistilanteesta: https://edition.cnn.com/2026/01/07/us/video/ice-shooting-minneapolis-digvid "Media: ICE:n am
      Maailman menoa
      152
      2337
    6. 6 kW saunan lämmityksestä kohta 10 euron lisämaksu / kerta

      Kokoomuslainen sähköyhtiöiden hallitsema Energiavirasto ehdottaa 5 kW:n rajaa, jonka ylittämisestä tulee lisämaksu. Tark
      Maailman menoa
      50
      2257
    7. Oikeistopuolueiden kannatus vain 37,8 %, vasemmiston 43,0 %

      Keskustaan jää 17,4 prosenttia ja loput ovat sitten mitä ovat. Mutta selvästikin Suomen kansa on vasemmalle kallellaan.
      Maailman menoa
      33
      2087
    8. Tiedän ettei

      Meistä mitään tule. Toinen oli sinulle tärkeämpi
      Ikävä
      19
      2051
    9. Mahonselän jäät - Saaristokunta Lieksa brutaalisti kriisin partaalla!

      Lieksan loppuvuoden hyvän kehityksen jälkeen ei olisi uskonut että palstan ahkerista kommentoijista huolimatta matkailu
      Lieksa
      137
      1941
    10. Laitetaan nyt kirjaimet kohdilleen

      kuka rakastaa ja ketä ?
      Ikävä
      85
      1939
    Aihe