There is no need to initialise jScrollPane on your content everytime window is resized. You should do it only once - on $(document).ready()
. Also, there is no need in using autoReinitialize if your content is staic. You should reinitialise jScrollPane to update scrollbar size only when you slideUp/slideDown one of your container or on window.resize
. So, code become less and more beautiful :)
function togglePanel(num) {
var jsp = $('#content').data('jsp');
jQuery('#a' + num).slideToggle({
"duration": "slow",
"step": function(){
jsp.reinitialise();
}
});
return false;
}
$(document).ready(function () {
var container = $('#content').jScrollPane({
showArrows: false,
autoReinitialise: false
});
var jsp = container.data('jsp');
$(window).on('resize', function(){
jsp.reinitialise();
});
// Workaround for known Opera issue which breaks demo (see
// http://jscrollpane.kelvinluck.com/known_issues.html#opera-scrollbar )
$('body').css('overflow', 'hidden');
// IE calculates the width incorrectly first time round (it
// doesn't count the space used by the native scrollbar) so
// we re-trigger if necessary.
if (container.width() != $(window).width()) {
jsp.reinitialise();
}
});