Profil detayı eklendi, herkes profillerine girip bir gözatsın! Sevdiğiniz üyelerin cevaplarını takip edin! Tüm güncellemeler

Mesajlaşma Ajax auto scrolling

Sayfa açılınca son mesaj en altta ancak hep sayfa en üstten başlıyor. Alta indirebiliyorum ancak ajax olduğu için inmiyor. Code

<div id="div"></div>

olduğu için ve içinde hiç bir şey olmadığı için indirmiyor.


Bunu nasıl çözebilirim?

3

Cevaplar (3)

İşlem devam ediyor, lütfen bekleyin..
Yusuf Kaan Karakaya
@TheYkkk
3 ay önce

burda birdaha sorulmustu ayni soru siteden bulabilirsin

Cevapla @kxyz3 ay önce
@TheYkkk, $('#div').scrollTop($('#div')[0].scrollHeight);
kod bu ama bende çalışmıyor
Cevapla @kxyz3 ay önce
hatayı buldum. ajax olduğu için <div class="div></div> bunu çözmek gerek.
İşlem devam ediyor, lütfen bekleyin..
Abdulbaki Zırıh
@abdulbaki
3 ay önce
var mesajlar = $(".mesajlar");
var height = mesajlar.offset().top + mesajlar.height();
mesajlar.scrollTop(height);

https://uzmancevap.org/soru/1004/chat-mesaj-gelince-asa-indirme

Cevapla @kxyz3 ay önce
@abdulbaki, <style>
#mesajlar {
width: 200px;
height: 100px;
overflow-y: scroll;
}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
$(document).ready(function() {
$("#mesajlar").load("cek.php");
});

setInterval(function() {$("#mesajlar").load('cek.php');}, 0);

</script>

<div id="mesajlar"></div>

<script>
var mesajlar = $("#mesajlar");
var height = mesajlar.offset().top + mesajlar.height();
mesajlar.scrollTop(height);
</script>
Cevapla @kxyz3 ay önce
@abdulbaki, bu şekilde yaptım, olmadı
Cevapla @abdulbaki3 ay önce
@kxyz, Bu şekilde sayfa ilk açıldığında scroll aşşağıya iner her mesaj geldiğinde insin istiyorsan mesaj hangi fonksyion ile listeleniyor ise oraya yazman gerekir yani bu örnekte senInterval içerisine yazmalısın.
İşlem devam ediyor, lütfen bekleyin..
Wpa
@HyKi89
3 ay önce
<div id="message">
  <div class="chat-discussion">
    <!-- Gelen mesajları buraya al -->
  </div>
</div>

Jquery Kodları

        $(document).ready(function () {
            $('#message .chat-discussion').animate({ scrollTop: $('#message .chat-discussion')[0].scrollHeight }, 1000);

            var validateOptions = {
                framework: 'bootstrap',
                excluded: [':disabled'],
                locale: 'tr_TR',
                icon: {
                    valid: 'glyphicon glyphicon-ok',
                    invalid: 'glyphicon glyphicon-remove',
                    validating: 'glyphicon glyphicon-refresh'
                },
                fields: {
                    message: {
                        validators: {
                            notEmpty: {}
                        }
                    }
                }
            }

            $("#message_form").formValidation(validateOptions);

        });



Cevapla @kxyz3 ay önce
<style>
#mesajlar {
width: 200px;
height: 100px;
overflow-y: scroll;
}
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script>
$(document).ready(function() {
$("#mesajlar").load("cek.php");
});

setInterval(function() {$("#mesajlar").load('cek.php');}, 0);


$(document).ready(function () {
$('#message .chat-discussion').animate({ scrollTop: $('#message .chat-discussion')[0].scrollHeight }, 1000);

var validateOptions = {
framework: 'bootstrap',
excluded: [':disabled'],
locale: 'tr_TR',
icon: {
valid: 'glyphicon glyphicon-ok',
invalid: 'glyphicon glyphicon-remove',
validating: 'glyphicon glyphicon-refresh'
},
fields: {
message: {
validators: {
notEmpty: {}
}
}
}
}

$("#message_form").formValidation(validateOptions);

});
</script>


<div id="message">
<div class="chat-discussion">
<div id="mesajlar"></div>
</div>
</div>
Cevapla @kxyz3 ay önce
@HyKi89, bu şekilde yaptım olmadı
İşlem devam ediyor, lütfen bekleyin..

Cevap yaz Sadece sorunun cevabını yazın