1
$(document).ready(function(){

var $container = $('#main_slider').cycle({ 
    fx:     'fade', 
    speed:   300, 
    timeout: 4000
}); 

$container.children().each(function(i) { 
    // create input 
    $('#thumb-'+(i+1)).click(function() { 
            // cycle to the corresponding slide 
            $("#black-bars").animate({"top": ''+(i*76.5)+'px'}, "slow", "swing");
            $container.cycle(i); 
            return false; 
        }); 
}); 

});

側面に親指があるシンプルなスライドショーがあり、クリックすると黒いバーが適切な位置にスライドして「強調表示」されます。

現在、この効果はユーザーが手動で親指をクリックしたときにのみ発生するため、各スライドが遷移した後に自動的にアニメーション化することも必要です。

Cycle には After 属性があり、すべてのスライドの後に関数を実行できると思いますが、カウンターを作成したり、現在どのスライドの「番号」を取得したりするにはどうすればよいでしょうか? 黒いバーの位置を決定するために必要です。

ありがとう

4

1 に答える 1

3

これにはオプション「before」と「after」を使用できます。これらのコールバック関数は両方とも、現在のスライドと次のスライドをパラメーターとして渡します。この例を確認してください: http://jquery.malsup.com/cycle/int2.html

于 2011-04-13T11:37:49.117 に答える