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);
});
window.addEventListener('scroll', function(e) {
console.log(window.scrollY);
});
Vastaukset 10
Vanhimmat
Skrollattavan elementin korkeus on: document.documentElement.scrollHeight
Ja ikkunan näkyvän osan korkeus: window.innerHeight
Noiden avulla saat varmaan laskettua.
Miten tuo pitäisi laskea, ( window.scrollY ) on paljon pienempi arvo kuin ( document.documentElement.scrollHeight )
1370 = document.documentElement.scrollHeight
468 = window.scrollY
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
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
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ä.
Hyvä, KIITOS
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.