2016-05-08 7 views
1

最近のプロジェクトで基盤6を使用していて、その下にタブが付いたスライダーがあるので、基礎6のタブを組み込み、JavaScript経由で自動的に切り替えることにしました。ブートストラップのshow("tab")機能のように、setInterval機能の次のタブで呼び出す機能が見つかりません。基盤を6つのタブに自動的に切り替える

答えて

1

私は、次のタブとタブパネル

function tabSwitch() { 
    var tabs = $("ul.tabs"); 
    var tab_content = $(".tabs-content"); 
    var currentTab = tabs.find(".is-active"); 
    var currentPanel = tab_content.find(".is-active"); 

    currentTab.removeClass('is-active').find("[aria-selected]").attr('aria-selected', false); 

    if (currentTab.next('li').length !== 0) { 
     currentTab.next("li").addClass('is-active').find("[aria-selected]").attr('aria-selected', true); 
    } else { 
     tabs.find("li:first").addClass('is-active').find("[aria-selected]").attr('aria-selected', true); 
    } 

    if (currentPanel.next('.tabs-panel').length !== 0) { 
     currentPanel.removeClass("is-active").next(".tabs-panel").addClass("is-active"); 
    } else { 
     currentPanel.removeClass("is-active"); 
     tab_content.find(".tabs-panel:first").addClass("is-active"); 
    } 
} 

var saleTimer = setInterval(tabSwitch, 5000); 

$("ul.tabs").find(".is-active").on("click", function() { 
    clearInterval(saleTimer); 
    saleTimer = setInterval(tabRotate, 5000); 
}); 
is-activeクラスを追加することで解決策を考え出したてい