如何激活ui-layout-west中的resize选项

时间:2014-08-16 13:10:59

标签: javascript jquery css

我正在尝试使用优秀的jQuery UI Layout插件创建一个完整的页面界面。 但不幸的是西侧无法用鼠标调整大小,我在下图中提到过。我无法找到任何解决方案。

以下是我使用的代码:

<div class="ui-layout-west">
    <%@include file="abc.jsp"%>
</div>

下面是我的西窗格示例图片。

Resize

1 个答案:

答案 0 :(得分:1)

我找到了一个解决方案,看起来你必须为jquery ui包含js。然后,您可以根据需要设置如下所示的可调整大小的选项。

<html>
<head>
<script src="jquery-latest.js"></script>
<script type="text/javascript" src="jquery-ui-latest.js"></script>
<script src="jquery.layout-latest.js"></script>
<script>
$(document).ready(function () {
    $('body').layout({          
        applyDefaultStyles: true,
        resizable: true,
        east__resizable:false,
        north__resizable:false,
        south__resizable:false,        
 });
});
</script>
</head>
<body>
<div class="ui-layout-center">Center</div>
<div class="ui-layout-north">North</div>
<div class="ui-layout-south">South</div>
<div class="ui-layout-east">East</div>
<div class="ui-layout-west">West</div>
</body>
</html>