jQuery循环插件-如何在每次单击导航链接时从幻灯片的开头重新开始？

每次我点击导航链接“服务”，它都会显示我访问过的前一部分。相反，我想重新开始始终显示第一部分。请问，我怎样才能使它起作用

这是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");

         }



      });


}

功能循环（）{
//服务周期。
var$cycleServices=$（“.cycleServices”）；
//寻呼。
$cycleServices
。之前（“
”）；
//让我们按下一个按钮。
$cycleServices
。在“下一次”之后；
$cycleServices.cycle（{
特效：“卷轴”，
速度:800,，
放松：“easeOutExpo”，
超时：0，
寻呼机：“.cycle services寻呼机”，
下一步：“.cycleServicesNext”，
上一页：“.cycleServicesPrevious”，
pagerAnchorBuilder:函数（idx、幻灯片）{
返回“
“+idx+”
”；
}
});
//根据选定的幻灯片循环调整面板大小。
var$panelServices=$（“面板服务”）；
$（“#cycle-services-pager-0”）
.on（“单击”，函数（）{
$panelServices
.animate（{“宽度”：“430px”}，800，“easeOutExpo”）；
});
$（“#cycle-services-pager-1”）
.on（“单击”，函数（）{
$panelServices
.animate（{“宽度”：“555px”}，800，“easeOutExpo”）；
});
$（“#cycle-services-pager-2”）
.on（“单击”，函数（）{
$panelServices
.animate（{“宽度”：“555px”}，800，“easeOutExpo”）；
});
$（“#cycle-services-pager-3”）
.on（“单击”，函数（）{
$panelServices
.animate（{“宽度”：“555px”}，800，“easeOutExpo”）；
});
$（#cycle-services-pager-4）
.on（“单击”，函数（）{
$panelServices
.animate（{“宽度”：“555px”}，800，“easeOutExpo”）；
});
$（“.cycleServicesNext”）
.on（“单击”，函数（）{
var thePanelID=$（“.cycle services pager”）.find（“li.activeSlide”）.text（）；
如果（面板==0）{
$panelServices
.animate（{“宽度”：“430px”}，800，“easeOutExpo”）；
}否则{
$panelServices
.animate（{“宽度”：“555px”}，800，“easeOutExpo”）；
}
});
}

您可以在循环分页中触发首页按钮。在这种情况下，您可以尝试：

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

---

你能解决这个问题吗？