Making tinyscrollbar work with changing, animating content

Question

I'm using tinyscrollbar to show a nice scrollbar.

Part of my content is hidden (display:none), and only shown after a button is clicked, in a slideDown()/slideToggle() animation.

When I reveal the extra content, the scrollbar does not update, and part of the content is now unreachable. Is there a solution that updates smoothly with the animation?

FYI, here is a non-smooth solution (just call .tinyscrollbar() again after the animation finishes):

$(".toggler").slideToggle().promise().then(function(){
  $("#scrollbar").tinyscrollbar()
});

Answer 1

Use the the tinyscrollbar_update() method. Thats a lot cleaner then initializing the scrollbar again.

$(".toggler").slideToggle().promise().then(function(){
  $('#scrollbar').tinyscrollbar_update();
});

Answer 2

Maybe use 'relative'

$('#scrollbar').tinyscrollbar_update();

There will be no need to animate scrollbar after toggle content. This solution has helped in my issue.