滑动jquery选项卡内容

Sliding jquery tabbed content

本文关键字:选项 jquery 滑动      更新时间:2023-09-26

有人能帮我改变标签内容代码褪色和滑动标签内容进出标签的变化请。

我使用这个脚本

和头位中的代码:

$('ul.tabs li').click(function(){
    var tab_id = $(this).attr('data-tab');
    $('ul.tabs li').removeClass('current');
    $('.tab-content').removeClass('current');
    $(this).addClass('current');
    $("#"+tab_id).addClass('current')
})

多谢!

您可以尝试如下:

$('ul.tabs li').click(function(){
        var tab_id = $(this).attr('data-tab');
        $('ul.tabs li').removeClass('current');
        $('.tab-content').fadeOut(100).removeClass('current');
        $(this).fadeIn(1000).addClass('current');
        $("#"+tab_id).fadeIn(1000).addClass('current');
 })

<

更新演示/strong>

向上滑动和向下滑动的方法如下:

$('ul.tabs li').click(function(){
        var tab_id = $(this).attr('data-tab');
        $('ul.tabs li').removeClass('current');
        $('.tab-content').slideUp("slow",function(){
              $(this).removeClass('current');
        });
        $(this).addClass('current');
        $("#"+tab_id).slideDown("slow",function(){
              $(this).addClass('current');
        });
})