JScrollPane not working properly with hidden content

Check this demo provided by the developer of the plugin

http://jscrollpane.kelvinluck.com/examples/invisibles.html

When the element is first shown you simply have to (re)initialise the scrollpane (or you could even use autoReinitialise if you like) and its width and height will be calculated correctly.

All that you need is

$(function(){
    $('.scroll-pane').jScrollPane({autoReinitialise: true});
});

and may be the recent version of the plugin