0

I have a div with following structure.

<div class="span12 sortable ui-sortable">
    <div class="box">
        <div data-original-title="" class="box-header well">
            <h2><i class="icon-edit"></i> All Messages</h2>
        </div>
        <div class="box-content chatHeight1">
            <div id="chtcontent" class="span12">

            </div>
            <hr/>

        </div>

    </div>
</div>

I am filling up the div with id -'chtcontent' after getting ajax response. However when the data is more there comes a horizontal scrollbar. So, as per logic, if data is more than the div height it should bring a scrollbar as well as it should focus to the bottom of div.

I tried with followings but its not working. 

 $('#chtcontent').scrollTop($('#chtcontent')[0].scrollHeight);

var d = $('#chtcontent');
d.scrollTop(d.prop("scrollHeight"));

also tried most of answers in this. Scroll to bottom of Div on page load (jQuery) .But stilll its not working.

Community
  • 1
  • 1
user1638279
  • 523
  • 2
  • 12
  • 26

1 Answers1

0

To use those function we need to call another functions to initialize them on required div.Here is some useful api.Hope it'll help.Read these once. http://jscrollpane.kelvinluck.com/api.html

saikiran.vsk
  • 1,788
  • 1
  • 10
  • 11