div有参数hide时不显示jQuery自定义内容滚动条

Question

我的网站上有div的jQuery自定义内容滚动条。 div内容的参数为("#content").hide()。当页面加载并且jQuery自定义内容滚动条完美运行时，div是可见的。

但是，如果页面加载时div内容不可见，则jQuery自定义内容滚动条不可见且不起作用。我注意到当缩小或放大窗口时，滚动条会显示。我在此网址上有一个小例子：http://www.frantatoulen.wz.cz/

问题可能在哪里？

Answer 1

问题是当隐藏#content时，插件脚本无法计算内容长度（隐藏元素的维度为零）。因此，该脚本假定内容不需要滚动条。

解决方案A：

在内容切换并显示后，您需要调用插件的更新方法（插件主页包含有关使用方法和参数的信息和示例）。在点击功能中，最后添加以下内容：

$("#tlacitko").click(function(){
    $("#content").toggle();
    $("#content").mCustomScrollbar("update");
});

注意：当您调整浏览器大小时，滚动条会起作用，因为它会在窗口调整大小事件上自动调用update方法。

解决方案B：

您只需将 updateOnContentResize 选项参数设置为 true 即可。每次内容长度更改时，都会自动调用 update 方法：

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