jQuery custom content scroller after ajax call

Question

I found here a lot of questions on this matter but small number of answers. Some of the answers were advanced:{ updateOnContentResize: true } , and I tried it, it didn't work. Also, one of the answers were reinitializing .mCustomScroll function on ajax success but it didn't work for me at all. Is there general solution for this or I should try some other customizable scroll libraries?

Answer 1

To update the content on elements that already have custom scrollbar(s), you need to add/append the new content inside the .mCSB_container element (instead directly to the element you called mCustomScrollbar function). Example:

//scrollbar initialization 
$(".content").mCustomScrollbar();

//at some point later on (within another script, function, ajax call etc.)
$(".content .mCSB_container").append("new content...");
//or targeting a specific .mCSB_container element (usefull with nested scrollbars)
$("#mCSB_1_container").append("new content...");