I've looked at all the div scrolling stuff here but none of it seems to work, i'm just trying to get a page with rails content loaded into a chat frame and have that div scroll to the bottom like a normal chat window would. everything loads fine, theres just no scrolling.html file:\[code\]<html><head> <title>Chat - Customer Module</title> </head> <div id="wrapper"> <div id="menu"> <p class="welcome">Welcome, <b></b></p> <p class="logout"><a id="exit" href="http://stackoverflow.com/questions/14533838/#">Exit Chat</a></p> <div style="clear:both"></div> </div> <div id="chatbox"> <% @array.each do |i| %> <dt><%=Time.parse(i["createdAt"]).to_time %></dt> <h3><dd><%= i["text"] %></dd></h3> <br /> <% end %></div> <form name="message" action=""> <input name="usermsg" type="text" id="usermsg" size="63" /> <input name="submitmsg" type="submit" id="submitmsg" value="http://stackoverflow.com/questions/14533838/Send" /> </form> </div> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script> <script type="text/javascript"> // jQuery Document $(document).ready(function(){ console.log("loading")var oldscrollHeight = $("#chatbox").attr("scrollHeight") - 20; //Scroll height before the request var newscrollHeight = $("#chatbox").attr("scrollHeight") - 20; //Scroll height after the request if(newscrollHeight > oldscrollHeight){ $("#chatbox").animate({ scrollTop: newscrollHeight }, 'normal'); } }); </script> </body> </html>\[/code\]CSS:\[code\]body { font:12px arial; color: #222; text-align:center; padding:35px; } form, p, span { margin:0; padding:0; } input { font:12px arial; } a { color:#0000FF; text-decoration:none; } a:hover { text-decoration:underline; } #wrapper, #loginform { margin:0 auto; padding-bottom:25px; background:#EBF4FB; width:504px; border:1px solid #ACD8F0; } #loginform { padding-top:18px; } #loginform p { margin: 5px; } #chatbox { text-align:left; margin:0 auto; margin-bottom:25px; padding:10px; background:#fff; height:350px; width:430px; border:1px solid #ACD8F0; overflow:auto; } #usermsg { width:395px; border:1px solid #ACD8F0; } #submit { width: 60px; } .error { color: #ff0000; } #menu { padding:12.5px 25px 12.5px 25px; } .welcome { float:left; } .logout { float:rightright; } .msgln { margin:0 0 2px 0; } \[/code\]
Scrolling Div content javascript and ruby on Rails
- Thread starter memsswano
- Start date