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

Question

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

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

问题可能在哪里？

Answer 1

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

解决方案A:

在内容切换并变得可见之后,您需要调用插件的更新方法(插件主页包含有关使用方法和参数的信息和示例).在您的点击功能中,最后添加以下内容:

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

注意:当您调整浏览器大小时,滚动条会起作用,因为它会在window resize事件上自动调用update方法.

解决方案B:

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

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