CODEWITHSUNDEEP
javascriptjqueryhtmlcssscroll
Harsh Gupta
Harsh Gupta

Reputation: 173

Default scrollbar position

I'm building a chat application in which I need the scrollbar to be at the bottom of the chat window (last message) on page load.

How do I accomplish this (Using jQuery or otherwise)?

Here's the chat window div:

<div id="ccwindow">

      <div class="bubble me">Hey!</div>
      <div class="bubble you">Hello</div>
      <div class="bubble me">I saw your post. Want to buy the book. Are you an XYZ University?</div>
      <div class="bubble you">Yes, sophomore year.</div>
      <div class="bubble me">Great!</div>
      <div class="bubble you">I'll buy it. Can you get it to school tomorrow?</div>
      <div class="bubble me">Sure. See you tomorrow!</div>

 </div>

Upvotes: 0

Views: 885

Answers (2)

NightOwlPrgmr
NightOwlPrgmr

Reputation: 1374

You could also use this:

$(window).load(function() {
    $("#ccwindow").animate({ scrollTop: $(document).height() - $(window).height() }, 1000);
});

Note:

Using the .load rather than .ready will take images into account.

Upvotes: 0

JBux
JBux

Reputation: 1394

Here you go: http://jsfiddle.net/vtep7Lf1/

$("document").ready(function() {
  $("#ccwindow").animate({ scrollTop: $("#ccwindow").height() }, "slow");
  return false;
});

Upvotes: 2

Related Questions