mesaj uygulamasında otomatik scroll etmek
arkadaşlar kolay gelsin, laravel-livewire ile bir chat uygulamasu yapıyorum. gönderilen mesajlar anlık olarak alt kısımdan eklenerek devam ediyor. fakat yüksekliğe sığmadığı zaman son gönderilen mesaj sığmadığı için en altta kalıyor ve görünmüyor. Bunun için bir event yazacağıım ama js tarafında tam olarak ne yapmalıyım bilmiyorum otomatik scroll olması için.
Soru hatalı mı? 👎
Eğer sorunun kurallara aykırı olduğunu düşünüyorsanız lütfen bize bildirin!
Cevaplar (2)
Scroll eyleminin gerçekleşmesini istediğiniz satırda (yeni mesajı append ettikten hemen sonra)
mesajların kapsayıcısı olan, yani scroll özelliği bulunan elementi seçerek scroll'u olabilecek en aşağıdaki yere konumlandırın.
Şu satırı ilgili yere ekleyebilirsiniz:
const $messagesWrapper = document.getElementById("messages-wrapper");
$messagesWrapper.scrollTop = $messagesWrapper.scrollHeight;
Benzer bir mesajlaşma kısmında css ile scrool kullanmıştım kendisi duruma göre aktif-deaktif oluyor onu neden kullanmıyorsunuz?