jquery tab 자동 슬라이드

다음 코드를 사용하여 jquery에서 탭을 만들고 누군가가 클릭하면 해당 탭이 열립니다. 따라서 지정된 간격으로 탭을 회전시킬 수 있도록 탭을 수정할 수 있습니다. 기존를 수정하려는 것처럼jquery tab 자동 슬라이드

// Tabs 
    // When page loads... 
    $(".tab-content").hide(); //Hide all content 
    $("ul.sidebar-tabs li:first").addClass("active").show(); //Activate first tab 
    $(".tab-content:first").show(); //Show first tab content 

    // On Click Event 
    $("ul.sidebar-tabs li").click(function() { 

     $("ul.sidebar-tabs li").removeClass("active"); //Remove any "active" class 
     $(this).addClass("active"); //Add "active" class to selected tab 
     $(".tab-content").hide(); //Hide all tab content 

     var activeTab = $(this).find("a").attr("href"); //Find the href attribute value to identify the active tab + content 
     $(activeTab).fadeIn(); //Fade in the active ID content 
     return false; 
    });

같은 HTML 코드는,

<ul class="sidebar-tabs"> 
    <li><a href="#tab-1">Tab1</a></li> 
    <li><a href="#tab-2">Tab2</a></li> 
</ul><!-- //sidebar-tabs --> 
<div class="tab-container"> 
    <div id="tab-1" class="tab-content"> 
    <div> 
    <div id="tab-2" class="tab-content"> 
    <div> 
</div>

출처

2011-11-22 Ajay