gpt4 book ai didi

jquery - Twitter bootstrap - 为选项卡式导航添加动画/过渡效果

转载 作者:技术小花猫 更新时间:2023-10-29 11:45:00 25 4
gpt4 key购买 nike

<分区>

我有一个基本的选项卡式导航,使用来自 Bootstrap 站点的示例。我如何添加动画效果(淡入和淡出)以便在单击每个选项卡时新内容淡入?

 <!--   i have a basic tabbed navigation using the example from the bootstrap site. how can i add an animation effect (fade in and out) so when each tab is clicked the new content is faded in? -->

<div class="tabbable">
<ul class="nav nav-tabs nav-stacked span3">
<li class="active">
<a href="#myDashboardNav" data-toggle="tab">
<i class="icon-align-justify"></i>
My dashboard
<span class="badge badge-important">20%</span>
</a>

</li>
<li id="myfeed">
<a href="#myFeedNav" data-toggle="tab">
<i class="icon-list-alt"></i>
My feed
<span class="badge badge-important">6</span>
</a>
</li>
<li id="notifications">
<a href="#notificationsNav" data-toggle="tab">
<i class="icon-time"></i>
Notifications <span class="badge badge-important">9</span>
</a>
</li>
</ul>

<div class="tab-content span8">
<div class="tab-pane well active" id="myDashboardNav" style="height: 330px">Content1
</div>
<div class="tab-pane well" id="myFeedNav" style="height: 330px">Content2

</div>

<div class="tab-pane well" id="notificationsNav" style="height: 330px">Content3

</div>

</div>

</div>

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com