ExtJS 2.0实用简明教程 之Border区域布局


Posted in Javascript onApril 29, 2009

该布局把容器分成东南西北中五个区域,分别由east,south, west,north, cente来表示,在往容器中添加子元素的时候,我们只需要指定这些子元素所在的位置,Border布局会自动把子元素放到布局指定的位置。看下面的代码:

Ext.onReady(function(){ 
new Ext.Viewport({ 
layout:"border", 
items:[{region:"north", 
height:50, 
title:"顶部面板"}, 
{region:"south", 
height:50, 
title:"底部面板"}, 
{region:"center", 
title:"中央面板"}, 
{region:"west", 
width:100, 
title:"左边面板"}, 
{region:"east", 
width:100, 
title:"右边面板"} 
] 
}); 
});

执行上面的代码将会在页面中输出包含上下左右中五个区域的面板,如下图所示:
ExtJS 2.0实用简明教程 之Border区域布局
Javascript 相关文章推荐
JQuery 无废话系列教程(一) jquery入门 [推荐]
Jun 23 Javascript
Javascript 函数中的参数使用分析
Mar 27 Javascript
javascript笔记 String类replace函数的一些事
Sep 22 Javascript
jQuery图片的展开和收缩实现代码
Apr 16 Javascript
jquery简单的拖动效果实现原理及示例
Jul 26 Javascript
js中的屏蔽的使用示例
Jul 30 Javascript
JavaScript声明变量名的语法规则
Jul 10 Javascript
分享js粘帖屏幕截图到web页面插件screenshot-paste
Aug 21 Javascript
详解Matlab中 sort 函数用法
Mar 20 Javascript
AngularJs ng-repeat 嵌套如何获取外层$index
Sep 21 Javascript
AngularJS select加载数据选中默认值的方法
Feb 28 Javascript
vue 自定义指令自动获取文本框焦点的方法
Aug 25 Javascript
ie 调试javascript的工具
Apr 29 #Javascript
理解JavaScript的caller,callee,call,apply
Apr 28 #Javascript
JS 判断代码全收集
Apr 28 #Javascript
js checkbox(复选框) 使用集锦
Apr 28 #Javascript
js 数组操作代码集锦
Apr 28 #Javascript
ie和firefox不兼容的解决方法集合
Apr 28 #Javascript
js 表单验证方法(实用)
Apr 28 #Javascript
You might like
基于PHP文件操作的详细诠释
2013/06/21 PHP
PHP统计数值数组中出现频率最多的10个数字的方法
2015/04/20 PHP
详解PHP错误日志的获取方法
2015/07/20 PHP
ucenter中词语过滤原理分析
2016/07/13 PHP
ThinkPHP3.1.x修改成功与失败跳转页面的方法
2017/09/29 PHP
laravel实现一个上传图片的接口,并建立软链接,访问图片的方法
2019/10/12 PHP
用 Javascript 验证表单(form)中的单选(radio)值
2009/09/08 Javascript
jQuery 使用手册(四)
2009/09/23 Javascript
JS 无法通过W3C验证的处理方法
2010/03/09 Javascript
推荐40个简单的 jQuery 导航插件和教程(下篇)
2012/09/14 Javascript
jQuery中queue()方法用法实例
2014/12/29 Javascript
jquery通过closest选择器修改上级元素的方法
2015/03/17 Javascript
用js实现博客打赏功能
2016/10/24 Javascript
jQuery实现获取form表单内容及绑定数据到form表单操作分析
2018/07/03 jQuery
JavaScript代码异常监控实现过程详解
2020/02/17 Javascript
[46:10]2014 DOTA2国际邀请赛中国区预选赛 CnB VS HGT
2014/05/21 DOTA
[07:08]2014DOTA2西雅图国际邀请赛 小组赛7月11日TOPPLAY
2014/07/11 DOTA
如何使用七牛Python SDK写一个同步脚本及使用教程
2015/08/23 Python
利用Python如何生成随机密码
2016/04/20 Python
从CentOS安装完成到生成词云python的实例
2017/12/01 Python
在python中按照特定顺序访问字典的方法详解
2018/12/14 Python
Python多进程fork()函数详解
2019/02/22 Python
Python实现计算文件MD5和SHA1的方法示例
2019/06/11 Python
Python collections中的双向队列deque简单介绍详解
2019/11/04 Python
Python列表list操作相关知识小结
2020/01/29 Python
详解matplotlib中pyplot和面向对象两种绘图模式之间的关系
2021/01/22 Python
python 递归相关知识总结
2021/03/03 Python
美国马匹用品和骑马配件购物网站:Horse.com
2018/01/08 全球购物
Wedgwood英国官方网站:英式精致骨瓷餐具、礼品与生活精品,源于1759年
2019/09/02 全球购物
上班睡觉检讨书
2014/01/09 职场文书
员工工作表现评语
2014/04/26 职场文书
铅球加油稿100字
2014/09/26 职场文书
餐厅感恩节活动策划方案
2014/10/11 职场文书
考试没考好检讨书(精选篇)
2014/11/16 职场文书
详解CSS中的特指度和层叠问题
2021/07/15 HTML / CSS
python识别围棋定位棋盘位置
2021/07/26 Python