jQuery循环插件如何添加活动类

时间:2012-04-10 22:24:54

标签: jquery jquery-plugins

示例: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&gt;

2 个答案:

答案 0 :(得分:6)

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

答案 1 :(得分:0)

这是一个快速demo来了解哪些是有效的。

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