初步学习EXT，小实例（viewport容器3）

//叶子节点移动时触发的nodedrop事件，内部自动实现了观察者模式
tp.on('nodedrop',function(n){
if(n.point=='append'){Ext.Msg.alert('message information',"当前的" + n.dropNode.text + "被" + n.target.text + "录取");}
else if(n.point=='above'){Ext.Msg.alert('message information',"当前的" + n.dropNode.text + "放在了" + n.target.text + "上面");}
else if(n.point=='below'){Ext.Msg.alert('message information',"当前的" + n.dropNode.text + "放在了" + n.target.text + "下面");}
});

//构建一个TAB面板
var tabpanel = new Ext.TabPanel({
region:'center',
items:[{title:'Default Tab',
html:'This is a first TabPanel '},{title:'tow',html:'I am tow'},{title:'three',html:'I am three'}],
activeTab:2 //默认第一个TAB面板为初始化内容
});

//这是一个VIEWPORT的容器
var vw = new Ext.Viewport({
layout:'border',
id:'viewport',
enableTabScroll:true,
items:[
{
region:'north',
autoHeight:true,
border:false,
margins:'1 1 5 1',
html:'<h1 class="x-panel-header">ViewPort Title</h1>'
},
tp,
tabpanel,
{
region:'south',
title:'Information',
collapsible:true,
html:'i am going here',
split:true,
height:100,
minHeight:100}]
});
});