Cycle2状态​​始终为假

Question

我有一个Cycle2幻灯片。我希望它每5秒循环一次幻灯片，但我也希望用户能够单击向上或向下键来推进幻灯片。点击向上或向下键时，我想确保幻灯片显示在进入下一个或上一个之前不忙。问题是，当我检查.cycle-busy时，它每次都返回false。我将幻灯片设置为暂停状态，并尝试检查。单击“向上”或“向下”键时暂停 - 暂停，并返回false。我错过了什么吗？

我正在使用jquery 1.8.2。

$(document).keydown(function (e) { 
    var busy = $('#mainSlideShow').is('.cycle-busy'); 
    alert(busy); 
    if ($('.cycle-slideshow').is(':animated')) 
     return false; 

    switch (e.which) { 
     case 38: 
      $('.cycle-slideshow').cycle('next'); 
      break; 

     case 40: 
      $('.cycle-slideshow').cycle('prev'); 
      break; 
    } 
}); 

<div id="mainSlideShow" > 
    <div class="cycle-slideshow" 
     data-cycle-timeout="5000" 
     data-cycle-slides="> div" 
     data-cycle-fx="scrollVert" 
     data-cycle-prev=".prev" 
     data-cycle-next=".next" 
     data-cycle-paused="false"> 
     <div class="slide" style="background-image: url('Images/SlideShow/building.jpg');"> 
      <div class="slide-wrapper"> 
       <div class="next"> 
        <img src="Images/prev.png" /> 
       </div> 
       <div class="caption-wrapper"> 
        <div class="caption"> 
         <h2 class="title">Commercial Products</h2> 
         <div class="description"> 
          Specializing in small to mid-size businesses, RAM offers a wide variety of coverages to meet your business needs. 
         </div> 
        </div> 
       </div> 
       <div class="prev"> 
        <img src="Images/next.png" /> 
       </div> 
      </div> 
     </div> 
     <div class="slide" style="background-image: url('Images/SlideShow/farm.jpg');"> 
      <div class="slide-wrapper"> 
       <div class="next"> 
        <img src="Images/prev.png" /> 
       </div> 
       <div class="caption-wrapper"> 
        <div class="caption"> 
         <h2 class="title">Commercial Products</h2> 
         <div class="description"> 
          Specializing in small to mid-size businesses, RAM offers a wide variety of coverages to meet your business needs. 
         </div> 
        </div> 
       </div> 
       <div class="prev"> 
        <img src="Images/next.png" /> 
       </div> 
      </div> 
     </div> 
     <div class="slide" style="background-image: url('Images/SlideShow/family.jpg');"> 
      <div class="slide-wrapper"> 
       <div class="next"> 
        <img src="Images/prev.png" /> 
       </div> 
       <div class="caption-wrapper"> 
        <div class="caption"> 
         <h2 class="title">Commercial Products</h2> 
         <div class="description"> 
          Specializing in small to mid-size businesses, RAM offers a wide variety of coverages to meet your business needs. 
         </div> 
        </div> 
       </div> 
       <div class="prev"> 
        <img src="Images/next.png" /> 
       </div> 
      </div> 
     </div> 
     <div class="slide" style="background-image: url('Images/SlideShow/house.jpg');"> 
      <div class="slide-wrapper"> 
       <div class="next"> 
        <img src="Images/prev.png" /> 
       </div> 
       <div class="caption-wrapper"> 
        <div class="caption"> 
         <h2 class="title">Commercial Products</h2> 
         <div class="description"> 
          Specializing in small to mid-size businesses, RAM offers a wide variety of coverages to meet your business needs. 
         </div> 
        </div> 
       </div> 
       <div class="prev"> 
        <img src="Images/next.png" /> 
       </div> 
      </div> 
     </div> 
    </div> 
</div 

Answer 1

的繁忙的值包含在幻灯片的选择哈希，访问此值，使用以下方法：

var opts = $('.cycle-slideshow').data('cycle.opts'); 
if(opts.busy){ 
    return false; 
}