2

我正在尝试将 ui-layout-west 窗格的宽度设置为特定尺寸，当它关闭时。默认情况下，当按下“切换器”时，窗格会完全关闭，如本例所示。我想要的是将“西窗格”设置为“40px”并仍保留部分内容。目前我可以通过 CSS 设置这个槽，但西窗格消失了。请参阅我的 JsFidle 示例以更好地理解。

div.ui-layout-resizer.ui-layout-resizer-west.ui-layout-resizer-closed.ui-layout-resizer-west-closed {
    left: 40px !important;
}

我怎样才能最好地获得这种效果？我想尽可能多地依赖 JQuery 插件设置，而不是 CSS。

4

1 回答 1

2

我认为问题在于关闭意味着关闭并消失，因此您不应该仍然能够看到框架。如果我理解您想要正确执行的操作，您可以通过使用自定义代码覆盖关闭操作来伪造它。

这涉及覆盖 onclose_start 回调，设置大小，然后返回 false 以防止窗格关闭。请注意，这意味着就系统而言，窗格并没有真正关闭。

下面的代码完成了所有这些，它在西窗格状态对象上创建了一个新变量来存储旧大小。它在创建函数的开头定义了它（尽管如果没有定义，系统不会抱怨）。您还可以使用全局变量或其他一些存储。您可以使该功能更通用，不仅适用于西方等。

我不确定您希望系统如何工作，您可能需要摆弄 if 条件。

$(document).ready(function () {
    var mylayout = $("body").layout(
        {west: {
            minSize: 40,
            onclose_start: function() {                     
                var closed_size = 40;          
                var current_size = mylayout.state.west.size;

                if (current_size <= closed_size) { 
                    mylayout.sizePane('west', mylayout.state.west.old_size);                    
                } else { 
                    mylayout.sizePane('west', closed_size);                    
                    mylayout.state.west.old_size = current_size;
                }                    
                return false;
            }}
        });
    mylayout.state.west.old_size = mylayout.state.west.size;
    });
于 2013-07-30T11:15:29.613 回答