JQuery : Faire défiler automatiquement une barre de défilement

Il arrive que l’on ait besoin de faire défiler automatiquement une barre de défilement vers le bas, par exemple pour un div contenant les messages d’un chat…

C’est en réalité assez simple à réaliser en utilisant JQuery.

Si l’on prend l’exemple d’un chat, notre div contenant les messages sera la suivante :

<div id="messages">...</div>

Le code JQuery permettant le défilement automatique vers le bas (sous réserve que conteneur soit d’une taille fixe et qu’il y ait un nombre de messages suffisant) est le suivant :

$('#messages').animate({"scrollTop": $('#messages')[0].scrollHeight}, "fast");

Ce code effectuera donc le défilement vers le bas de la barre de défilement du conteneur avec une animation très rapide.