Tabs 标签页(选项卡)

Tabs

参考 bootstrap

<div class="tabbable">

<ul id="myTab" class="nav nav-tabs">

<li class="active">

<a href="#home" data-toggle="tab">Home</a>

</li>

<li>

<a href="#profile" data-toggle="tab">Messages</a>

</li>

</ul>

<div class="tab-content">

<div class="tab-pane in active" id="home">

home tab content

</div>

<div class="tab-pane" id="profile">

profile tab content

</div>

</div>

</div>

Position 方向

.tabs-below、.tabs-left、.tabs-right

Color & Size 颜色、大小

.tab-color-blue 、.background-blue 背景色为蓝色

<ul class="nav nav-tabs tab-color-blue background-blue"></ul>

.tab-size-bigger 大按钮

.nav-tabs 添加 .tab-space-1 .tab-space-2 间隔

.nav-tabs 添加.padding-2 .padding-4

.tab-content 添加 .padding-2 .padding-4

<ul class="nav nav-tabs padding-18 tab-size-bigger"></ul>

<div class="tab-content no-border padding-24"></div>

Notes

重置

$('#myTab a[data-toggle="tab"]').on('shown.bs.tab', function (e) {

//if( $(e.target).attr('href') == "#home" ) drawChartNow();

//if($(e.target).is('#my-chart-tab')) drawChartNow();

})