Possible Duplicate:
Scroll to bottom of div?
I'm building a chatroom, and I would like to set it up so the scroll is always kept to the current message. For example, here is my view:
<div id="chatWrap">
<div id="chatLog">
<% @chatLog.each do |c| %>
<% account = getAccountByAccountId(c.account_id) %>
<div class="chat">
<div class="chatUsername">
<p><%= link_to account.username, account_path(account) %> said:</p>
</div>
<div class="chatMessage">
<p><%=h c.message %></p>
</div>
</div>
<% end %>
</div>
<textarea id="message" name="message">Type your message here and hit enter...</textarea>
</div>
Now my css so far is as follows:
#chatWrap {
width:800px;
margin-left:auto;
margin-right:auto;
}
#chatLog {
background-color:#FFFFFF;
padding:10px;
height:500px;
overflow:auto;
color:#161616;
}
As you can see I set the overflow to auto and fixed the height of the div.
The problem is that every time I send a new message the scroll does not move to the current message.
I was wondering if there is a JQuery solution to this?
Thank you,
Brian
