Question

I have a problem with the jQuery extension jScrollPane combined with the scrollTo plugin. The scrollbar disappears if I apply the scrollTo command to the scrollable container and the scroll is at the top position. (If the scroll is not at the top position, everything is working fine.)

To get the scrollbar back, I try to reinitialize it. What happens then is that the scroll goes back to the top, canceling the scrollTo command.

My code:

  $('#myScrollableDiv div.jspContainer').scrollTo(delta);
  c = $('#myScrollableDiv').jScrollPane({
        autoReinitialise: true,
        maintainPosition: true
  });

Answer 1

If you use jScrollPane, you have to use the functions of jScrollPane to scroll down.

var delta = 20;
var element = $('#myContainer').jScrollPane();
var api = element.data('jsp');
$('#scroll').click(function() {
    api.scrollByY(delta);
});​

Try it on jsfiddle

Refer the jScrollPane Api for a list of functions for the api variable.

Note: It doesn’t work when you omit the p tags around the text.