scroll position for div on timer tick event
- by MeqDotNet
I have a chat box that refresh every 7 seconds by a timer the problem is that the div is scrolling top each time the timer I have tried to add the following
Page.ClientScript.RegisterClientScriptBlock(this.GetType(), "focus", "document.getElementById('divMessages').scrollTop = document.getElementById('divMessages').style.height;", true);
to the timer tick but it doesn't work ticks here is my code
<table border="0" cellpadding="0" cellspacing="0">
<tr>
<td style="width: 500px;">
<div id="divMessages" style="background-color: White; border-color:Black;border-width:1px;border-style:solid;height:300px;width:592px;overflow-y:scroll; font-size: 11px; padding: 4px 4px 4px 4px;" onload="SetScrollPosition();" onresize="SetScrollPosition()">
<asp:Literal Id="litMessages" runat="server" />
</div>
</td>
<td> </td>
<td>
<div id="divUsers" style="background-color: White; border-color:Black;border-width:1px;border-style:solid;height:300px;width:150px;overflow-y:scroll; font-size: 11px; padding: 4px 4px 4px 4px;">
<asp:Literal Id="litUsers" runat="server" />
</div>
</td>
</tr>
<tr>
<td colspan="3">
<asp:TextBox Id="txtMessage" onkeyup="ReplaceChars()" onfocus="SetToEnd(this)" runat="server" MaxLength="100" Width="500px" />
<asp:Button Id="btnSend" runat="server" Text="Send" OnClientClick="SetScrollPosition()" OnClick="BtnSend_Click" />
<b>Color:</b> <asp:DropDownList Id="ddlColor" runat="server">
<asp:ListItem Value="Black" Selected="true">Black</asp:ListItem>
<asp:ListItem Value="Blue">Blue</asp:ListItem>
<asp:ListItem Value="Navy">Navy</asp:ListItem>
<asp:ListItem Value="Red">Red</asp:ListItem>
<asp:ListItem Value="Orange">Orange</asp:ListItem>
<asp:ListItem Value="#666666">Gray</asp:ListItem>
<asp:ListItem Value="Green">Green</asp:ListItem>
<asp:ListItem Value="#FF00FF">Pink</asp:ListItem>
</asp:DropDownList>
<asp:Button Id="btnLogOut" Text="Log Out" runat="server" OnClick="BtnLogOut_Click" />
</td>
</tr>
</table>
<script type="text/javascript">
var div = document.getElementById('divMessages');
div.scrollTop = div.style.height;
</script>
</ContentTemplate>
</asp:UpdatePanel>