0

jquery スライド タブのトップ メニューを無効にしようとしています。タブからタブへの操作を前・次のみで操作したい。

私のライブデモをご覧ください。

Jクエリ:

<script>
$(document).ready(function() {
    // Horizontal Sliding Tabs demo
    $('div#st_horizontal').slideTabs({
        // Options              
        contentAnim: 'slideH',
        contentAnimTime: 600,
        contentEasing: 'easeInOutExpo',
        tabsAnimTime: 300
    });

    $(".st_tab_view").each(function(i) {
        var totalSize = $(".st_tab_view").size() - 1;
        if (i != totalSize) {
            next = i + 2;
            $(this).append("<a href='#' class='next-tab mover' rel='" + next + "'>Next Page &#187;</a>");
        }
        if (i !== 0) {
            prev = i;
            $(this).append("<a href='#' class='prev-tab mover' rel='" + prev + "'>&#171; Prev Page</a>");
        }
    });

    $('.prev-tab').click(function() {
        $('.st_tab_active').parent().prev().children('a').trigger('click');
        return false;
    });

    $('.next-tab').click(function() {
        $('.st_tab_active').parent().next().children('a').trigger('click');
        return false;
    });


});​
</script>
4

2 に答える 2

1

次の CSS を変更します。

div.st_horizontal div.st_tabs_container { /* Tabs main container */        
    position:relative;
    /* This will hide it all together */
    display:none;
    z-index:100;    
    /* Or change with and heights */    
    width:0% !important;    
    height:0px;
    margin-bottom:-1px;    
    overflow:hidden;
}

または、(jQuery UI CSS が追加された後) ページにさらに CSS を追加して、デフォルトの CSS の上書きを節約することもできます。

div.st_horizontal div.st_tabs_container {
    /* This will hide it all together */
    display:none;
    /* Or change with and heights */    
    width:0% !important;    
    height:0px;
}

それ以外の場合は、独自のコントロールを作成することをお勧めします。

これら 2 つのいずれかが、jQuery コードへの飛び込みを節約します。

于 2012-06-25T18:19:02.487 に答える
1

"

  • 水平タブ #1

    • あなたのjqueryを次のように変更してください -

    $('.prev-tab').click(function() { $('.st_tab_active').attr('disabled','disabled'); var tab= $('.st_tab_active').parent(). prev().children('a'); tab.removeAttr('disabled'); tab.trigger('click'); // tab.attr('disabled','disabled'); return false; });

    $('.next-tab').click(function() {
    $('.st_tab_active').attr('disabled','disabled');
   var tab=  $('.st_tab_active').parent().next().children('a');
    tab.removeAttr('disabled');
    tab.trigger('click');
    //tab.attr('disabled','disabled');
    return false;
});

    "

    于 2012-06-25T18:35:20.680 に答える