Tab Panel 示例

PS:JS文件没有经过压缩,所以可以直接打开查看。完整源码请见:tabs-example.js,样式表见:tabs-example.css

下面的 Tabs 没有设置固定高度,根据内容自动调整。由已有的元素生成。


脚本源码:
var tabs = new Ext.TabPanel('tabs1');
tabs.addTab('script', "View Script");
tabs.addTab('markup', "View Markup");
tabs.activate('script');
<div id="tabs1">
    <div id="script" class="tab-content">
        (Content goes here)
    </div>
    <div id="markup" class="tab-content">
        (Content goes here)
    </div>
</div>

下面的 Tabs 设置了固定高度,可滚屏查看内容。完全由脚本生成。