Problems with scrollto in SlimScroll JQuery plugin

Question

I have 2 DIVs with implemented Slimscroll plugin. both work fine, but one is supposed to be scrolled all the way up <div id="msg_left_sidebar">....</div> (seems to be default) and the other DIV <div id="chat_content">....</div> all the way down. It almost works as expected with the following code:

$(function(){
    var scrollDown_int = $('#chat_content')[0].scrollHeight;
    $('#msg_left_sidebar').slimScroll({
        height: (browserheight - 190) +'px',
        width: '248px'
    });
    $('#chat_content').slimScroll({
        height: (browserheight - (207 + 190)) +'px',
        width: '526px',
        scrollTo : scrollDown_int+'px',
      });
       //$('#chat_content').scrollTop(scrollDown_int); // this works as good as the scrollTo parameter 
  });

The problem I'm having is: even though the content is scrolled all the way to the bottom, the scrollbar itself is on top of the DIV element.

This means, as soon as I start scrolling, no matter how (scroll wheel on mouse or grabbing the scrollbar) the content goes all the way up...

Is this a known issue? How can I make this scrollbar also go to the bottom.

Please help. Hope that my explanation is clear enough :-)

Answer 1

Slimscroll has an option for the starting position of the container:

start - top or bottom or $(selector) - defines initial position of the scrollbar. When set to bottom it automatically scrolls to the bottom of the scrollable container. When HTML element is passed, slimScroll defaults to offsetTop of this element. Default: top.

From: http://rocha.la/jQuery-slimScroll

If you adjust your code to the following, both the div and the scrollbar with be placed at the bottom of the container:

$('#chat_content').slimScroll({
   height: (browserheight - (207 + 190)) +'px',
   width: '300px',
   start: 'bottom'
});

JSFiddle: http://jsfiddle.net/oqet7pe4/