Grow your CSS skills. Land your dream job.

Unable to use jquery scrollbar multiple times . Check link

  • # April 15, 2013 at 2:42 am

    Please check this link

    The scrollbar under “testimonials” seems to work alright. It has the id “content_1”

    However, the scrollbar under the link

    “Domain training > TCS recognized external certification” is not visible. The scrollbar only appears if I right click on the div to inspect the element. This div has the id “content_2.”

    Here’s the documentation site

    [http://manos.malihu.gr/tuts/jquery_custom_scrollbar.html](http://manos.malihu.gr/tuts/jquery_custom_scrollbar.html “”)

    # April 16, 2013 at 5:40 am

    Found the solution:

    The div to which the scrollbar wasnt being applied was hidden by default, and as per the documentation, it would not be visible in such cases. The solution – modify the jquery as per the documentation.

    > n order for the custom scrollbar to work correctly, your content block must be visible (i.e. should not have display:none) and its content should be fully loaded. Otherwise you must call plugin’s update method after the above conditions are met.

    > Hidden content blocks (either by CSS display property or jQuery $.hide()) have zero dimensions, so calling mCustomScrollbar function on them will not work. Instead, you should call the function after your elements become fully visible, so the script calculates content length correctly and apply/update the scrollbar

    The solution code


    $(".content").mCustomScrollbar({
    advanced:{
    updateOnContentResize: true
    }
    });

    This, by the way, is a damn neat scrollbar

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".