jQuery Cycle plugin - как перезапустить с начала слайда каждый раз, когда я нажимаю на ссылку навигации?

Question

каждый раз, когда я нажимаю на ссылку «Сервисы», отображается предыдущий раздел, который я посетил. Вместо этого я хотел бы снова начать отображение первого раздела. Как я могу это сделать, пожалуйста?

Это HTML разметка:

<ul id="nav"> 
<li id="nav-home">Home</li> 
<li id="nav-services">Services</li> 
<li id="nav-contact">Contact</li> 
</ul> 


<div class="panel" id="panel-services"> 
<ul class="cycle-services cycle"> 

<li> 
<div class="columnServicesintro"> 
<p>This is 1st Section</p> 
</div> 
</li> 

<li> 
<div class="columnServices"> 
<p>This is 2nd Section</p> 
</div> 
</li> 

<li> 
<div class="columnServices"> 
<p>This is 3rd Section</p> 
</div>     
</li> 

</ul> 
</div> 

И это JQuery:

function cycle() { 


    // Services Cycle. 
    var $cycleServices = $(".cycle-services"); 

    // The paging. 
    $cycleServices 
     .before('<ul class="cycle-services-pager" />'); 

    // Let's put in the next button. 
    $cycleServices 
     .after("<div class='cycleServicesNext'>Next</div>"); 

    $cycleServices.cycle({ 
     fx:  "scrollHorz", 
     speed: 800, 
     easing: "easeOutExpo", 
     timeout: 0, 
     pager: ".cycle-services-pager", 
     next: ".cycleServicesNext", 
     prev: ".cycleServicesPrevious", 
     pagerAnchorBuilder: function(idx, slide) { 
     return '<li id="cycle-services-pager-' + idx + '">' + idx + '</li>'; 
     } 
    }); 

    // Resize Panel according to slide cycle selected. 
    var $panelServices = $("#panel-services"); 

    $("#cycle-services-pager-0") 
     .on("click", function() { 
     $panelServices 
      .animate({ "width" : "430px" }, 800, "easeOutExpo"); 
     }); 

    $("#cycle-services-pager-1") 
     .on("click", function() { 
     $panelServices 
      .animate({ "width" : "555px" }, 800, "easeOutExpo"); 
     }); 

    $("#cycle-services-pager-2") 
     .on("click", function() { 
     $panelServices 
      .animate({ "width" : "555px" }, 800, "easeOutExpo"); 
     }); 

    $("#cycle-services-pager-3") 
     .on("click", function() { 
     $panelServices 
      .animate({ "width" : "555px" }, 800, "easeOutExpo"); 
     }); 

    $("#cycle-services-pager-4") 
     .on("click", function() { 
     $panelServices 
      .animate({ "width" : "555px" }, 800, "easeOutExpo"); 
     }); 


    $(".cycleServicesNext") 
     .on("click", function() { 

     var thePanelID = $(".cycle-services-pager").find("li.activeSlide").text(); 

     if (thePanelID == 0) { 

      $panelServices 
       .animate({ "width" : "430px" }, 800, "easeOutExpo"); 

     } else { 

      $panelServices 
       .animate({ "width" : "555px" }, 800, "easeOutExpo"); 

     } 



     }); 


} 

Answer 1

Вы можете вызвать первую кнопку страницы в пагинацией цикла. В этом случае вы можете попробовать:

$("#nav-services").first().click(function(){ 
$(".cycle-services-pager li").first().click(); 
});