jquery jScrollPane 视口太小

Question

我在使用名为 jScrollPane 的 jQuery 插件时遇到了一些问题。目前它有一个奇怪的行为。它只是不读取包含的 table 的整个高度。 html结构如下：

<div id="container-of-the-table">
<table></table>
</div>

javascript如下：

setupScrollPane('#container-of-the-table');

function setupScrollPane(el, options) {
    var id = (el instanceof jQuery) ? el.attr("id") : el.substring(1);
    api = $(el).jScrollPane({
        horizontalGutter: 6,
        verticalGutter: 6,
        mouseWheelSpeed: 50
    }).data("jsp");
    scrollPaneApi[id] = api;

    if (undefined != options){
        if (undefined != options.scrollToX){
            api.scrollToX (options.scrollToX);
        }
        if (undefined != options.scrollToY){
            api.scrollToY (options.scrollToY);
        }
    }
}

css如下：

table {
    display: block;
    height: 165px;
    width: 1080px;
}
#container-of-the-table{
    overflow:auto;
}

table 的内容超过 1000 像素，但显示的内容（插件右侧有一个最小滚动条 css）小于 200 像素。

该插件似乎可以正常工作，但不是因为它让我只能滚动 table.

的一小部分

我发现 forum post 有类似的问题，但我不明白它是如何解决的。

Answer 1

显然要解决这个问题，您必须修改 #container-of-the-table 的 css。这是正确的代码：

#container-of-the-table{
    overflow:auto;
    max-height: 165px;
    height: auto;
}

很高兴我的回答对您有所帮助！

jquery jScrollPane 视口太小

jquery jScrollPane too small viewport

javascript

jquery

height

jquery-jscrollpane