jQuery的週期獨立的字幕

Question

我試圖創建循環調用中的相關說明顯示：

$('#slideshow-images').cycle({ 
     fx: 'scrollVert', 
     pager: '#slideshow-navigation', 
     activePagerClass: 'active', 
     timeout: 8000, 
     delay: 2000, 
     manualTrump:false, 
     before: captionProgress 
}); 

function captionProgress(currSlideElement, nextSlideElement, options, forwardFlag) { 
    var arr = $('.slideshow-caption'); 
    // need to do something here but don't know what... 
} 

因此，在新的圖像幻燈片之前 - 標題的變化 - 標題具有相同的指數作爲圖像，但我不知道如何觸發正確的標題。

這裏的幻燈片的結構：

<div id="slideshow-captions"> 
    <div class="slideshow-caption active"> 
     <h2>Heading 1</h2> 
     <h1>Consulting<br /> 
     Services</h1> 
    </div> 
    <div class="slideshow-caption"> 
     <h2>Heading 2</h2> 
     <h1>Consulting<br /> 
     Services</h1> 
    </div> 
    <div class="slideshow-caption"> 
     <h2>Heading 3</h2> 
     <h1>Consulting<br /> 
     Services</h1> 
    </div> 
</div> 

<div id="slideshow-images"> 
    <div class="slideshow-image"> 
     <h1 class="heading">Gallery image</h1> 
     <img src="/images/header/01.jpg" alt="" width="620" height="304" />  
    </div> 
    <div class="slideshow-image"> 
     <h1 class="heading">Gallery image</h1> 
     <img src="/images/header/02.jpg" alt="" width="620" height="304" />    
    </div> 
    <div class="slideshow-image"> 
     <h1 class="heading">Gallery image</h1> 
     <img src="/images/header/03.jpg" alt="" width="620" height="304" />   
    </div> 
</div> 

任何想法如何實現的呢？

Answer 1

arr.eq(currSlideElement).show(); 

或者，如果你有「積極」類控制可視性

arr.find('.active').removeClass('active'); 
arr.eq(currSlideElement).addClass('active'); 

我不知道這是否會工作太：

arr.eq(currSlideElement).removeClass('active'); 
arr.eq(nextSlideElement).addClass('active'); 

我想這最後一個片斷是最合適的。