Estoy creando un chat inicialmente en PHP en el que en el div llamado Message cargo la conversación que se generó.
A través de JavaScript/Ajax, accedo al archivo PHP y abro la conversación que se grabó, colocando los datos de este archivo en el div Mensaje. Por razones obvias, después de un mensaje número X, se genera un pergamino en este div. Usando CSS, configuré un overflor:auto que genera el desplazamiento vertical.
Inicialmente, no pude hacer que la barra de desplazamiento bajara y mostrara el último mensaje enviado. Usando el siguiente código, logré hacer esto...
$(document).ready(function() { setInterval(function(){ readMessage(); var textArea = document.getElementById('Message'); textArea.scrollTop = textArea.scrollHeight; },1000); });Sin embargo, si quiero leer un mensaje anterior, arriba y fuera del campo de visión, cuando muevo manualmente el pergamino hacia arriba (haciendo clic en la barra de desplazamiento y hacia arriba O con el mouse, desplazándose hacia arriba), el código de arriba hace que el pergamino baje , no permitiéndome leer lo que quiero de la conversación.
¿Como puedó resolver esté problema?
simplemente use setTimeout en su lugar, y luego vuelva a iniciar el tiempo de espera después de desplazarse
$(document).ready(function() { setTimeout(scrol,1000); function scrol() { readMessage(); var textArea = document.getElementById("Message"); textArea.scrollTop = textArea.scrollHeight; setTimeout(scrol,1000); } }avíseme si esto funciona, así como si cometo algún error de sintaxis o de convención, ya que estoy muy familiarizado con javascript pero soy muy nuevo en jQuery