jQuery的周期插件如何添加一个主动类

Question

例如：http://jsfiddle.net/kuTLf/

代码如下所示：

<div id="main"> 
     <div id="slideshow" class="pics"> 
      <div id="nav"></div> 
      <img src="http://cloud.github.com/downloads/malsup/cycle/beach1.jpg" width="200" height="200" /> 
      <img src="http://cloud.github.com/downloads/malsup/cycle/beach2.jpg" width="200" height="200" /> 
      <img src="http://cloud.github.com/downloads/malsup/cycle/beach3.jpg" width="200" height="200" /> 
     </div> 
</div> 

JS：

$(function() { 
    $('#slideshow').cycle({ 
     fx:  'turnDown', 
     speed: 'fast', 
     timeout: 3000, 
     pager: '#nav', 
     slideExpr: 'img' 
    }); 
}); 

我怎么能当前活动类添加到当前IMG ？像<img class='active>

Answer 1

$('#slideshow').cycle({ 
    after: function(el, next_el) { 
     $(next_el).addClass('active'); 
    }, 
    before: function(el) { 
     $(el).removeClass('active'); 
    } 
}); 

Answer 2

这是一个快速demo知道哪些是活动的。

function onAfter1(curr,next,opts) { 
    currentSlide = $(".thePager a.activeSlide").html(); 
    if(!currentSlide) currentSlide = "1"; 
    $('.slideCaption').html(currentSlide + '/' + opts.slideCount); 
}