如何使面板自动切换

Question

我做了面板，但我不知道如何让它们自动切换，如果你能帮助我，我将不胜感激。

JS： // akcii面板

$(".load-block:first").addClass('active'); 
$("#akciiContent li").click(function(event) { 
    event.preventDefault(); 
    var elemId = $(this).attr("data-akcii"); 
    $("#akciiContent li").removeClass("active"); 
    $(".ak-block").removeClass("selected"); 
    $(this).addClass("active"); 
    $("#"+elemId).addClass("selected"); 
}); 

HTML：

<div class="row"> 
        <div class="akcii-block-one"> 
         <ul id="akciiContent"> 
          <li data-akcii="block-three" class="load-block"> 
           <p>Приведи друга</p> 
           <div class="loader"></div> 
          </li> 
          <li data-akcii="block-four" class="load-block"> 
           <p>Установка центрального охранного прибора бесплатно</p> 
           <div class="loader"></div> 
          </li> 
         </ul> 
        </div> 
        <div class="akcii-block-two"> 
         <div id="block-three" class="ak-block"> 
          <img src="includes/icons/akcii-3.jpg"> 
         </div> 
         <div id="block-four" class="ak-block"> 
          <img src="includes/icons/akcii-4.jpg"> 
         </div> 
        </div> 
       </div> 

Answer 1

HTML标记

<div class="panels"> 
<ul> 
    <li class="active" data-panel="panel1">Tab 1</li> 
    <li data-panel="panel2">Tab 2</li> 
<ul> 
<div id="panel1" class="panel active">Panel 1 content</div> 
<div id="panel2" class="panel">Panel 2 content</div> 
</div> 

jQuery函数

$(document).ready(function(){ 
    $('.panels ul li').on('click', function(){ 
     if($(this).hasClass('.active')){ 
      //ignore if its already active 
      return; 
     } 

     var active = $('.panels ul li.active, .panels .panel.active'); 
     active.removeClass('active'); 

     //set active tab 
     $(this).addClass('active'); 
     //set attive panel 
     $('#' + $(this).attr('data-panel')).addClass('active'); 
    }); 
}); 

CSS

.panels .panel{ 
    display:none; 
} 

.panels .panel.active{ 
    display:block; 
}