w2layout.showTabs
更新日: 2018-09-07
showTabs(type)
パネルのタブを表示します。
- type: string
- パネル名。
説明
第1引数のtype
は、パネルの名前を指定します。 名前は以下を指定することができます。
- top
- left
- main
- right
- preview
- bottom
レイアウトを以下のように指定した場合、
$('#layout').w2layout({
name : 'layout',
panels : [
{ type: 'top', size: 40 },
{ type: 'main', content: 'This is main panel',
tabs: {
active: 'tab2',
tabs: [
{ id: 'tab1', caption: 'Tab 1' },
{ id: 'tab2', caption: 'Tab 2' },
{ id: 'tab3', caption: 'Tab 3' }
],
onClick: function (event) {
console.log('event');
}
}
},
{ type: 'preview', size: 200 }
]
});
タブを隠します。
w2ui['layout'].hideTabs('main');
または、タブを表示します。
w2ui['layout'].showTabs('main');
デモ
レイアウトをクリックする度に、main
パネルのタブを表示/非表示します。
JavaScript
$('#layout').w2layout({
name : 'mylayout',
panels : [
{ type: 'top', content: 'top', size: 40 },
{ type: 'main', content: 'This is main panel',
tabs: {
active: 'tab2',
tabs: [
{ id: 'tab1', caption: 'Tab 1', },
{ id: 'tab2', caption: 'Tab 2', },
{ id: 'tab3', caption: 'Tab 3', }
],
},
},
]
});
$('#layout').on('click', function() {
if (w2ui['mylayout'].get('main').show.tabs) {
w2ui['mylayout'].hideTabs('main');
} else {
w2ui['mylayout'].showTabs('main');
}
});
© 2017. .
Code licensed under theMIT License. Documentation licensed underCC BY 3.0.
このコンテンツはvitmalinaによるw2ui.layoutドキュメントを翻訳/改変したものです。