Database veri çekme Hakkında Soru

Merhaba arkadaşlar,

Ben web siteme bir chat bölümü yaptım ancak birkaç sorunum var

Chat yazışmaları database'e kayıt ediliyor ve ordan çekiyorum,

Soru 1- eğer konuşmaları yukarıdan aşağıya doğru ilk mesajdan son mesaja doğru sıralarsam sağ tarafta bulunan scrollbar en üstte duruyor ve yeni mesajları görmek için her defasında scroll barı en aşağıya çekmek gerekiyor, scroll barı otomatik aşağıya çekecek bir fonksiyon tüm araştırmalarıma rağmen bulamadım,
onu nasıl yapabilirim,

Soru 2-üstte sorduğum soru içeriğinde sadece sohbet olan chat.php bölümü içindi,
index.php bölümünde diğer konuların arasına yerleştirdiğim chat bölümündede sadece son gönderilen 6 mesajı göstermek istiyorum, çünkü chat konuşmaları uzun olursa mobil görünümde sayfayı yukardan aşağı doğru gezerken, chat bölümüne gelindiğinde daha aşağı geçmek zor oluyor, ekranı kaydırdıkça chat geçmişine gidiyor.

DESC LIMIT 6 yaparsam
son mesaj
sondan 2. mesaj
sondan 3. mesaj..... şeklinde sıralanıyor

ASC LIMIT 6 YAPARSAM

ilk mesaj
2. mesaj
3.mesaj.... şeklinde sohbette fii zamandan kalma ilk mesajlar gözüküyor

istediğim sıralama
-Sondan 6. mesaj
-Sondan 5. mesaj
....
-son mesaj

Sohbet bölümlerindeki div yapım

Sohbet

buda database çekmek için kullandığım kodlar

$SOHBET2 = mysql_query("SELECT * FROM chat ORDER BY id DESC LIMIT 6");
while ($SOHBETS2 = mysql_fetch_array($SOHBET2)) {
echo '

' .$SOHBETS2['username'] . ' ' .$SOHBETS2['date'] . '
' .$SOHBETS2['text'] . '

';
}

yokmu yardım edecek, hala çözemedim :(

https://stackoverflow.com/questions/25505778/automatically-scroll-down-chat-div bu sayfayı incelersen çözüm bulabilirsin.

Verdiğiniz kaynaktaki paylaşılan tüm çözümleri denedim anca scrollbarı aşağı indiremedim. Ben biraz bu koduda yeteneksizim sanırım. yada benim benim sohbet bölümünün css doları veya java script kodları buna engel oluyor.

Java Kodları

<script>
$("#send_message").on("click", function (event) {
event.preventDefault();
var data = $('input[name="message"]').val();
$.ajax({
url: "../db/config.php?islem=chatmesajgonder",
type: "POST",
data: "deger="+data,
success: function (cevap) {
document.getElementById("MESAJAT2").reset();
}
});
});
</script>


css kodları


#sohbet .content .contact-profile {
width: 100%;
height: 10px;
line-height: 60px;
background-color:#fff;
color: #000;
}
#sohbet .content .messages {
height: 300px;
min-height: calc(100% - 115px);
max-height: calc(100% - 115px);
overflow-y: scroll;
overflow-x: hidden;
}
#sohbet .content .messages::-webkit-scrollbar {
width: 8px;
background: rgba(0, 0, 0, 0);
}
#sohbet .content .messages::-webkit-scrollbar-thumb {
background-color: rgba(0, 0, 0, 0.3);
}
#sohbet .content .messages ul li {
display: inline-block;
clear: both;
float: left;
margin: 0px 0px 0px 0px;
width: calc(100% - 25px);
font-size: 0.9em;
}
#sohbet .content .messages ul li.replies p {
background: #f5f5f5;
float: left;
width: 100%;
max-width: 350px;
word-wrap: break-word;
}

#sohbet .content .messages ul li p {
display: inline-block;
padding: 10px 15px;
border-radius: 20px;
max-width: 205px;
line-height: 130%;
}
#sohbet .content .message-input .wrap input {
font-family: 'PT Sans' ;
float: left;
border: none;
width: calc(100% - 80px);
padding: 11px 32px 10px 8px;
font-size: 1.5em;
background: #ffe5e5;
color: #fc3e81;
}

#sohbet .content .contact-profile {
width: 100%;
height: 60px;
line-height: 60px;
background-color: #fff;
color: ;
}

#sohbet .content .message-input .wrap button {
float: right;
border: none;
width: 60px;
padding: 12px 0;
cursor: pointer;
background-image: linear-gradient(to right, #dae8e3, #cbe5dc, #c7e6dc, #b1e0d0, #a1dbc7);
color: #f5f5f5;
text-align: center;
margin-right: 10px;
border-radius: 20px;
}


html kodları

(3 Seviye+)

Gönder

Bu scrollbarı otomatik aşağı indirmem ve, atılan son 20 civarı mesajı veritabanından çekmem için inceleyip yardımcı olursanız sevinirim