ext TabPanel学习(1)
效果图:
[img]http://dl2.iteye.com/upload/attachment/0087/3572/9a8554ae-eae1-31e2-b66c-75648863e966.png[/img]
js代码:
Ext.onReady(function(){
??? var tabDemo = new Ext.TabPanel({
??? ??? renderTo:Ext.getBody(),
??? ??? width:300,
??? ??? activeTab:0,//当前激活标签
??? ??? frame:true,
??? ??? closable:true,
??? ??? items:[{
??? ??? ??? ??? contentEl:'tabOne',//标签页的页面元素id
??? ??? ??? ??? title:'嘎嘎',
??? ??? ??? ??? closable:true//是否实现关闭按钮,默认false
??? ??? ??? ???
??? ??? ??? },{
??? ??? ??? ??? contentEl:'tabTwo',
??? ??? ??? ??? title:'你们好啊,小伙伴们',
??? ??? ??? ??? closable:true,
??? ??? ??? }]
??? })
})
html代码:
<body>
??? <div>
??? ??? <div id="tabOne"
??? ??? onclick="parent.frames['mainFrame'].location='http://wlxt-8436.iteye.com/'"
??? ??? ??? ??? >我的博客</a>
??? ??? <iframe id="mainFrame" name="mainFrame" src="http://www.163.com/"
??? ??? ??? ??? ??? frameborder='0' height='100%'
??? ??? ??? ??? width="100%" style="overflow:hidden"></iframe>
??? </div>
</body>