My auto scroll function using jQuery isn't working, here is my CSS:
#convo_mes{
text-align:left;
width:98%;
height:80%;
background:#fff;
border:1px solid #000;
overflow-x:auto;
}
And in my JavaScript:
$(".mes").click(function(){
var user = $(this).attr("id");
$("#convo").html("<b>"+user+"</b>");
$("#convo_ctrl").show();
$(".send_to").attr("id",user);
$(".convo_mes").html("Loading conversation <img width='15' height='15' src='./img/load.gif'>");
setTimeout(function(){auto_scrollmes},3000);
setTimeout(function(){get_convo(user)},2000);
});
function auto_scrollmes(){
var objDiv = $("#convo_mes");
objDiv.scrollTop = objDiv.scrollHeight;
}
I've made changes but the auto scroll feature still isn't working. Here's a snippet of my HTML code:
<div id="conversation">
<h2>Conversation</h2>
<hr />
<center>
<div id="convo">
Please select a message to load in here!
</div>
<div id="convo_mes">
<div class="convo_mes">
</div>
</div>
<div id="convo_ctrl">
<textarea spellcheck="false" placeholder="Enter your message here..." id='mes_text_area'></textarea><a href="#send" id="send_message">Send</a>
</div>
</div>