web-dev-qa-db-fra.com

Comment puis-je déterminer si un div défile vers le bas?

Comment puis-je déterminer, sans utiliser jQuery ou toute autre bibliothèque JavaScript, si un div avec une barre de défilement verticale défile jusqu'en bas?

Ma question n'est pas de savoir comment faire défiler vers le bas. Je sais comment faire ca. Je veux déterminer si le div est déjà fait défiler vers le bas.

Cela ne fonctionne pas:

if (objDiv.scrollTop == objDiv.scrollHeight)
javascriptscrollscrollbar
59
Bjorn Tipling

Vous êtes assez proche en utilisant scrollTop == scrollHeight.

scrollTop fait référence au haut de la position de défilement, qui sera scrollHeight - offsetHeight

Votre instruction if devrait ressembler à ceci (n'oubliez pas d'utiliser le triple égal):

if( obj.scrollTop === (obj.scrollHeight - obj.offsetHeight))
{
}

Edit: Corrigé ma réponse, était complètement faux

76
James Davies

Renvoie vrai si un élément est à la fin de son défilement, faux s'il ne l'est pas.

element.scrollHeight - element.scrollTop === element.clientHeight

Mozilla Developer Network

7
eosimosu

Afin d'obtenir des résultats corrects en tenant compte de choses telles que la possibilité d'une bordure, d'une barre de défilement horizontale et/ou d'un nombre de pixels flottant, vous devez utiliser ...

el.scrollHeight - el.scrollTop - el.clientHeight < 1

REMARQUE: Vous DEVEZ utiliser clientHeight au lieu de offsetHeight si vous voulez obtenir les résultats corrects. offsetHeight vous donnera des résultats corrects uniquement quand el n'a pas de bordure ou de barre de défilement horizontale

6
Spencer

Un peu tard pour cette fête, mais aucune des réponses ci-dessus ne semble fonctionner particulièrement bien quand ...

  • La mise à l'échelle de l'affichage est appliquée au système d'exploitation pour les écrans UHD
  • La mise à l'échelle/zoom est appliquée au navigateur

Pour répondre à toutes les éventualités, vous devrez arrondir la position de défilement calculée:

Math.ceil(element.scrollHeight - element.scrollTop) === element.clientHeight
6
series0ne