Panel with Tabs

A layout panel may be created with tabs. It uses w2tabs object, therefore, you can use anything w2tabs support. There is no need to define a name of the tabs, because it will be overwritten with layout.name + '_tabs'. It will also add tabs.owner attribute that is a reference to the layout.
$(function () { var pstyle = 'border: 1px solid #dfdfdf; padding: 5px;'; $('#layout').w2layout({ name: 'layout', panels: [ { type: 'top', size: 50, resizable: true, style: pstyle, content: 'top' }, { type: 'left', size: 200, resizable: true, style: pstyle, content: 'left' }, { type: 'main', style: pstyle + 'border-top: 0px;', content: 'tab1', tabs: { active: 'tab1', tabs: [ { id: 'tab1', caption: 'Tab 1' }, { id: 'tab2', caption: 'Tab 2' }, { id: 'tab3', caption: 'Tab 3' }, ], onClick: function (event) { this.owner.content('main', event); } } } ] }); });