fedguide.github.io/docs/pc-tab.md at master · fe-knowledge/fedguide.github.io · GitHub

70 lines (63 loc) · 2.57 KB

layout	default
title	Tab切换
order	17
published	true
category	PCUI

Tab切换（ hbTab ）更新时间：{% timeago 2016-06-07 %}

注意：tab默认的第一项需要加上.active类，因为第一个默认是显示的。如果需要有动画效果，请在每个 tab-pane 上加上 .fade 类且第一个tab-pane需要加上 .in 类

动画效果 为css3动画效果，在低版本浏览器，不执行动画，请注意！
具体tab的样式，可根据自己的模块需求，自定义。

有两种方法可调用tab组件：

每个tab标签上加上 `data-toggle=hbTab`

{% example html %}

语文

数学

英语

物理

化学

生物

{% endexample %}

使用js方法

{% example html %}

语文

数学

英语

物理

化学

生物

<script> // 仅作演示用 $('#myJSTabs a').click(function (e) { e.preventDefault(); $(this).hbTab('show'); }) </script>

{% endexample %}