<%--
Created by IntelliJ IDEA.
User: taohj
Date: 2014/11/3
Time: 20:27
To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title>EXT JS 布局</title>
<link rel="stylesheet" type="text/css" href="./js/ext/resources/css/ext-all.css">
<script type="text/javascript" src="./js/ext/bootstrap.js"></script>
<script type="text/javascript" src="./js/ext/ext-lang-zh_CN.js"></script>
</head>
<body>
<script type="text/javascript">
Ext.onReady(function () {
var accordion = Ext.create("Ext.panel.Panel", {
title: "导航栏—west",
layout: "accordion", //设置为手风琴布局
layoutConfig: {
animate: true
},
width: 250,
minWidth: 90,
region: "west", //设置方位
split: true,
collapsible: true,
items: [
{ title: "用户管理", html: "嵌套面板一", iconCls: "save" },
{ title: "商品管理", html: "嵌套面板二", iconCls: "search" },
{ title: "系统管理", html: "嵌套面板三", iconCls: "back" }
]
});
new Ext.Viewport({
title: "Viewport",
layout: "border", //这里是（border）边界布局
defaults: {
bodyStyle: "background-color: #FFFFFF;",
frame: true
},
items: [
accordion, //这里是（accordion）手风琴布局
{ region: "north", height: 100, html: '系统名称—north' },
{ region: "center", split: true, border: true, html: 'center' },
{ region: "south", html: "版权—south", split: true, border: true, height: 50 }
]
});
});
</script>
</body>
</html>
Created by IntelliJ IDEA.
User: taohj
Date: 2014/11/3
Time: 20:27
To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title>EXT JS 布局</title>
<link rel="stylesheet" type="text/css" href="./js/ext/resources/css/ext-all.css">
<script type="text/javascript" src="./js/ext/bootstrap.js"></script>
<script type="text/javascript" src="./js/ext/ext-lang-zh_CN.js"></script>
</head>
<body>
<script type="text/javascript">
Ext.onReady(function () {
var accordion = Ext.create("Ext.panel.Panel", {
title: "导航栏—west",
layout: "accordion", //设置为手风琴布局
layoutConfig: {
animate: true
},
width: 250,
minWidth: 90,
region: "west", //设置方位
split: true,
collapsible: true,
items: [
{ title: "用户管理", html: "嵌套面板一", iconCls: "save" },
{ title: "商品管理", html: "嵌套面板二", iconCls: "search" },
{ title: "系统管理", html: "嵌套面板三", iconCls: "back" }
]
});
new Ext.Viewport({
title: "Viewport",
layout: "border", //这里是（border）边界布局
defaults: {
bodyStyle: "background-color: #FFFFFF;",
frame: true
},
items: [
accordion, //这里是（accordion）手风琴布局
{ region: "north", height: 100, html: '系统名称—north' },
{ region: "center", split: true, border: true, html: 'center' },
{ region: "south", html: "版权—south", split: true, border: true, height: 50 }
]
});
});
</script>
</body>
</html>
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
