【问题标题】:Hide current tab and display the next tab based on href?隐藏当前选项卡并根据 href 显示下一个选项卡?
【发布时间】:2010-12-11 04:13:26
【问题描述】:

我正在尝试使用 jquery 隐藏当前显示的标签并根据其 href 淡入新标签...

这是我的 HTML

<div id="leader">
    <ul id="llist">
         <li class="t current"><a href="#solutions"><span>sage solutions</span></a></li>
         <li class="m"><a href="#management"><span>credit mangement solutions</span></a></li>
         <li class="b"><a href="#thirdparty"><span>third party additions</span></a></li>
    </ul>

                <div id="lcontent">
                    <div id="solutions" class="tab">
                        <h2>Title</h2>
                        Description
                    </div>                  
                    <div id="management" class="tab">
                        <h2>Title</h2>
                        Description
                    </div>
                    <div id="thirdparty" class="tab">
                        <h2>Title</h2>
                        Description
                    </div>
                </div>
</div>

还有 JQUERY(它还会将图像滑动到选中的选项卡)

$('#leader #llist li').click(function() {
    $('#leader #llist li').removeClass('current');
var thisTop = $(this).offset().top;
$('.pointer').animate( {'top': thisTop} );
    $(this).addClass('current');
    $('.tab').fadeOut();

});

单击列表中的链接时,当前选项卡当前不会淡出或淡入...任何帮助将不胜感激。

【问题讨论】:

  • 当用户根据其 ID(因此使用#href)单击其中一个链接时,我试图淡出标签,我认为这是最好的开始方式

标签: javascript jquery


【解决方案1】:

这是我认为您正在寻找的示例。

http://jsbin.com/iceli4/edit

希望这能让你开始。

鲍勃

【讨论】:

    猜你喜欢
    • 2021-12-19
    • 1970-01-01
    • 2013-12-20
    • 2017-05-06
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2018-01-03
    • 2016-02-15
    相关资源
    最近更新 更多