Comment puis-je détecter lorsqu'un utilisateur a fait défiler vers le bas d'une page Web ?

Identifier la position de défilement de l'utilisateur sur une page Web

Déterminer si un utilisateur a fait défiler vers le bas d'une page Web est essentiel pour exécuter des actions spécifiques , comme la mise à jour automatique de la page. Voici comment réaliser cette détection :

Pour commencer, vous devez enregistrer un écouteur d'événement de défilement sur l'objet fenêtre :

window.onscroll = function(ev) {

Dans ce gestionnaire d'événements, vous pouvez calculer le défilement actuel positionnez-la et comparez-la à la hauteur de la page Web :

if ((window.innerHeight + Math.round(window.scrollY)) >= document.body.offsetHeight) {

• window.innerHeight : représente la hauteur visible du navigateur window.
• window.scrollY : indique la position de défilement vertical dans la page Web.
• document.body.offsetHeight : donne la hauteur totale du contenu de la page Web, y compris les zones défilées et non défilées.

Si la somme de window.innerHeight et window.scrollY est supérieure ou égale à document.body.offsetHeight, cela implique que l'utilisateur a atteint le bas de la page, déclenchant les actions que vous devez effectuer.

Exemple de mise en œuvre

Par exemple, pour mettre à jour la page Web avec du nouveau contenu une fois arrivé en bas, vous pouvez utiliser le code suivant :

window.onscroll = function(ev) {
    if ((window.innerHeight + Math.round(window.scrollY)) >= document.body.offsetHeight) {
        // Load or generate new content to add to the bottom of the page
    }
};

En employant cette technique, vous pouvez déterminer efficacement si un utilisateur a fait défiler jusqu'à la fin d'une page et a exécuté les actions appropriées en conséquence.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!