mCustomScrollBar: Uncaught TypeError: $(…).mCustom

问题:

I am trying to initialise and destroy a mCustomScrollBar scrollbar plugin depending on the window's width (some jquery in an es6 app, traspiled using webpack/babel). However I get an error when resizing the window:

"Uncaught TypeError: $(…).mCustomScrollBar is not a function".

Here is my code:

function initCustomScrollbar() {
    var scrollPane = document.querySelector(".scroll-content");
    var scrollPaneInit = $(scrollPane).mCustomScrollbar();

    setTimeout(function () {
        var scrollInnerPane = $(scrollPane).find(".mCustomScrollBox");
        $(scrollInnerPane).height(window.innerHeight + "px");
    }, 500);

    $(window).resize(function () {
        if (window.innerWidth < 768) {
            initCustomScrollbar();
        } else {
            $(scrollPane).mCustomScrollBar('destroy');
        }
    });
}

initCustomScrollbar();

Can someone point out where I m going wrong?

回答1:

I have solved the problem, somehow my subconscious forgot Javascript was case sensitive... the function should read:

$(scrollPane).mCustomScrollbar();

not

$(scrollPane).mCustomScrollBar();

smh!!!