Ext.onReady(function(){ var panel = new Ext.Panel({ //el:'text', title:'MyPanel', collapsible:true,//可收缩 floating:true,//可浮动 draggable:true, //可拖拽 html :'aaaaa', pageX :100, pageY :50, width: 500, height:300, titleCollapse: true, frame: true,//圆角边框 // renderTo:Ext.getBody(), draggable: { insertProxy: true,//拖动时不虚线显示原始位置 onDrag : function(e){ var pel = this.proxy.getEl(); this.x = pel.getLeft(true); this.y = pel.getTop(true); //获取拖动时panel的坐标 var s = this.panel.getEl().shadow; if (s) { s.realign(this.x, this.y, pel.getWidth(), pel.getHeight()); //shadow的realign方法的四个参数,改变shadow的位置大小属性 } }, endDrag : function(e){ this.panel.setPosition(this.x, this.y); } }, tbar:[{text:"button1"},{text:"button2"}], //顶部工具栏 bbar:[{text:"button1"},{text:"button2"}], //底部工具栏 buttons:[{text:"button1"},{text:"button2"}] //footer部工具栏 }); var tabs = new Ext.TabPanel({ renderTo: document.body, height:100, buttons:[{text:"back"}, {text:"next"}] }); tabs.add({ title:'title1', html:'你好', closable:true }); tabs.add({ title:'title2', html:'html2', closable:true }); tabs.activate(0); });