Cycle2 State 항상 false

Question

Cycle2 슬라이드 쇼가 있습니다. 5 초마다 슬라이드를 순환시키고 싶지만 사용자가 슬라이드를 올리려면 위 또는 아래 키를 클릭 할 수 있어야합니다. 위 또는 아래 키를 클릭하면 다음 또는 이전으로 진행하기 전에 슬라이드 쇼가 사용 중이 아닌지 확인하고자합니다. 문제는 .cycle-busy를 확인할 때마다 매번 false를 반환하는 것입니다. 슬라이드 쇼를 일시 중지하도록 설정하고 위로 또는 아래로 키를 클릭 할 때 .cycle-paused를 확인한 다음 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; 
} 

을