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