javascript - jQuerySplitter 控件/kendoSplitter 不调整大小

Question

如果调整底部 Pane 的大小， View 将缩小，并且无法恢复到原始大小。此外，即使我将大小设置为 100%， View 也不会占据整个屏幕。我试过像这样在中间和底部 Pane 的垂直部分设置静态尺寸:

$("#vertical").kendoSplitter({
    orientation: "vertical",
    panes      : [
        {
            collapsible: false,//toolbar should be a set height and unable to be collapsed
            resizable  : false,
            size       : "50px"
        },
        {
            collapsible: false //main section, not collapsible, but resizable
        },
        {
            collapsible: true, size: "200px"
        }
    ]
});

但无论何时完成， Pane 上都会出现一个滚动条，其余部分隐藏在空白下方。

jsFiddle:here

jQuery Splitter/kendoSplitter 示例:here

Answer 1

尝试为 mainView 使用以下 css 定义:

#mainView {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

这使得主容器在窗口调整大小时占据 100% 的屏幕大小。

参见 this修改后的 JSFiddle。