jQuery自定义滚动条插件不会使用horizo​​ntalScroll更新：true

Question

我正在使用jquery插件jQuery custom content scroller

来源： http://manos.malihu.gr/jquery-custom-content-scroller/

在垂直模式下效果很好。 我可以调用mCustomScrollbar并调用update方法。

看到这个小提琴： http://jsfiddle.net/Vinyl/2mU7H/1/

但是在水平模式下，当我调用更新方法时，我遇到了问题。没有内容。

看到这个小提琴： http://jsfiddle.net/Vinyl/4CW3p/1/

你知道为什么吗？

JS代码：

$(document).ready(function () {
    $("#content").mCustomScrollbar({
        horizontalScroll: true,
        scrollButtons: {
            enable: true
        },
        theme: "dark"
    });
});

$("#button").click(function () {
    $("#content").show();
    $("#content").mCustomScrollbar("update");
});

$("#button_close").click(function () {
    $("#content").hide();
});

CSS代码

#content {
    display:none;
    overflow:hidden;
    text-align:left;
    width:150px;
    height:150px;
    background-color: #666;
    color:#fff;
}

HTML代码

<div id="content">
    <p>lorem ipsum lorem ipsum lorem ipsum lorem ipsum</p>
    <p>lorem ipsum lorem ipsum lorem ipsum lorem ipsum</p>
    <p>lorem ipsum lorem ipsum lorem ipsum lorem ipsum</p>
    <p>lorem ipsum lorem ipsum lorem ipsum lorem ipsum</p>
    <p>lorem ipsum lorem ipsum lorem ipsum lorem ipsum</p>
    <p>lorem ipsum lorem ipsum lorem ipsum lorem ipsum</p>
    <p>lorem ipsum lorem ipsum lorem ipsum lorem ipsum</p>
    <p>lorem ipsum lorem ipsum lorem ipsum lorem ipsum</p>
</div>
<p id="button">Show Content</p>
<p id="button_close">Hide Content</p>

Answer 1

Fiddle

您忘记了autoExpandHorizontalScroll设置：）

---

$("#content").mCustomScrollbar({
    horizontalScroll: true,
    scrollButtons: {
        enable: true
    },
    theme: "dark",
    advanced: {
        autoExpandHorizontalScroll: true
    }
});