user-a5567ffg user-a5567ffg - 1 year ago 162
Javascript Question

mCustomScrollbar - scrollbar only appearing on F12 press (dev tools / Firebug) and not on hidden elements/divs

Having a weird problem with mCustomScrollbar - Similar problem here:

stubborn prolem with popular custom scrollbar

The scrollbar doesn't show until you re-size the window or hit F12 (tested on both IE9 and FF - so Developer and Firebug). As soon as you do either, the code kicks in. The elements are initially hidden, and shown either using .show() or .fadeIn()


.info-text {
width: 230px;
height: 170px;
overflow: hidden;
display: block;


<p class = "info-text">



The JS is held within a

Answer Source

Solved it. The reason that it wasn't firing was because I was trying to add the functionality onto a div that wasn't initially visible, and subsequently brought in using .fadeIn(). For some reason it doesn't like that. I had to use:


to bring in the scrollbar after the element was visible. So in my case it was:

$("#elementFadingIn").fadeIn(500, function() {

    $("#elementFadingIn .scrollableElement").mCustomScrollbar('update');


Then it worked.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download