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

201

    Vastaukset 10

    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. Hallituksen järjestämä spektaakkeli tuo vessanpyttykeissi

      Että olisi kymmenien kansanedustajien kodeissa käyty ihan tuosta vaan, eikä kukaan kansanedustaja kerro niin käyneen, va
      Maailman menoa
      326
      1300
    2. Sysmän "ilon päivä"

      Ja taas palaa hirveä määrä verorahoja, ihan turhaan soopaan. Eikö nämä jotka kuntapolitiikassa valittavat ja tuhoaa vaan
      Sysmä
      74
      909
    3. Uskon, että saataisiin kaikki selvitettyä

      Mutta yhteys on jäissä, minä olen jäässä, enkä osaa tai uskalla enää lähestyä. Se vaan on niin. Naiselta Jos ei ole hyvä
      Ikävä
      61
      813
    4. Pakko myöntää mies

      En mä aina ihan rehellinen sulle ollut
      Ikävä
      120
      683
    5. Joka ilta mietin

      sua❤️Mitä teet, missä meet? Kaipaatko yhtään? Yön tullen toivotan mielessäni sulle hyvää yötä ja aamuisin huomenet. Joka
      Ikävä
      38
      672
    6. Riitastako pelastaja

      Riitta jätti hakemuksen. Hyvä niin. On ainakin yksi mistä ottaa. Pertsa ei taida aikuistua koskaan ja Pekka hoiteli silt
      Kemijärvi
      43
      670
    7. Timo Vornanen.

      On siinäkin yksi täystampio. Eipä ihme, että persukannattajat sen eduskuntaan äänestikin.
      Maailman menoa
      53
      633
    8. Mikä kaivatullesi

      On tärkeintä elämässään?
      Ikävä
      49
      628
    9. mielikuva

      Mitä luulet hänen ajattelevan sinusta?
      Ikävä
      50
      606
    10. Luottamus

      Luotan vain siihen mitä tapahtuu IRL. Anonyymipalstan vihjailut eivät merkitse minulle mitään.
      Ikävä
      95
      552
    11. 45
      537
    12. 32
      521
    13. Kadutko mies sitä miten reagoit?

      ..siihen sotkuun, jonka jälkeen mikään ei ole ollut kuin ennen. 🥺
      Ikävä
      48
      515
    14. Tässä ovat Elämäni biisi -vieraat lauantai 3.10. - Yksi vieras on todellinen suomalaisten suosikki

      Jos menisit Elämäni biisiin, mikä olisi elämäsi biisi ja miksi? Elämäni biisi tulee suorana lähetyksenä Tampereelta. K
      Viihde ja kulttuuri
      9
      496
    15. Millaisen talvitakin haluaisit?

      Talveen vielä aikaa, mutta talvitakit tulleet kauppoihin. Millainen olisi unelmiesi talvitakki? Itse tykkäisin jostain
      Sinkut
      84
      485
    16. Kylypylä mätänee

      Kuka sotki uimaaltaan bakteereilla
      Suomussalmi
      22
      480
    17. En voi kertoa meistä kenellekään

      Minulla on ikävä sinua mies.. Oon yrittänyt taas unohtaa, mutta silti tulet mieleeni lähes päivittäin. Eihän meitä voi o
      Ikävä
      30
      455
    18. Olisitko nainen ihan nolona

      Jos et saisikaan sitä nousemaan...
      Sinkut
      79
      447
    19. Onko kahvila Retro samalla pub???

      Netin mukaan anniskeluoikeudet. Käykö tuolla kaljoitteluporukkaa? Onko iltaviihdettä? Olen muuttamassa marraskuussa Kuhm
      Kuhmo
      8
      447
    20. Iivari esittää poliisin tutkintaa

      Siikalatvan kunnanjohtaja Pekka Iivari on pannu ison pyörän liikkeelle. Entinen Kemijärven historian lyhimmän kaupunginj
      Kemijärvi
      21
      421
    Aihe