如何在jQuery Layout插件中拆分窗格?

时间:2013-04-07 16:08:46

标签: jquery layout

我正在使用jQuery Layout插件创建一个包含北,南,西,东和中心窗格的页面。我想分割 - 在布局开始后 - 西窗格分为两个窗格(西北和西南)。

但是我没有在API中找到任何分割窗格的函数!有什么想法吗?

1 个答案:

答案 0 :(得分:0)

您可以使用嵌套窗格。该插件通过childOptions支持无限嵌套。 http://layout.jquery-dev.com/demos/nested_simple.html

我建议唯一地命名子窗格。

   <div id="mainContainer">
        <iframe class="ui-layout-center" id="someiframecontent-right">Center Right content</iframe>
        <div class="ui-layout-west">
            <div class="ui-layout-childsouth">North West content </div>
            <div class="ui-layout-childcenter">South west content </div>
        </div>
    </div>
    <script type="text/javascript">
        $('#mainContainer').layout({
            west__minSize: 100,
            west__size: 0.5,
            west__maxSize: 0.9,
            center__minSize: 100,
            center__size: 0.5,
            center__maxSize: 0.9,
            livePaneResizing: true,
            west__childOptions: {
                center__paneSelector: '.ui-layout-childcenter',
                center__minSize: 100,
                center__size: 0.5,
                center__maxSize: 0.9,
                south__paneSelector: '.ui-layout-childsouth',
                south__minSize: 100,
                south__size: 0.5,
                south__maxSize: 0.9,
                livePaneResizing: true
            }
        });
    </script>

请记住,中心窗格始终是必需的(包括在子窗格中),因为需要填充其他窗格留下的剩余空间。