애니메이션 도움말

Question

"FeatureList"Jquery Plugin을 사용하여 내 콘텐츠 슬라이더를 만들었습니다.

스크립트는 여기에서 찾을 수 있습니다 :

실제로 슬라이더에 (항목에 "현재"클래스를 추가 http://i41.tinypic.com/6jkeq1.jpg : 여기

http://pastebin.com/7iyE5ADu 내가 달성하기 위해 triyng있어 무엇을 보여줄 수있는 exemplificative 이미지 예를 들어 사각형 1, 2 및 3)과 각 엄지 손가락에 대해 주 영역에 내용을 표시합니다.

예에서 간격은 2 초이고 스크립트는 1에서 2로, 2에서 3으로 전환됩니다.

엄지의 연속 애니메이션을 만들고 싶습니다. 누구든지 나를 도울 수 있습니까?

Answer 1

• DEMO는 :http://aseptik.net/demo/help-with-animation

$(function() { 
    //go trought each LI 
    $('#tabs > li').each(function(i) { 
     // and Add incremental ID to each one... 
     $(this).attr('id', i + 1); 
    }); 
    //set interval... and call function 
    setInterval('swapImages()', 2000); 
}); 
function swapImages() { 
    var images = ['junku','codepoet','rappensuncle','nuomi','jam343','kk','ccgd','xdjio']; 
    //count all LI's 
    var total_lis = $('#tabs > li').size(); 
    // get the current LI ID based on where .current class... 
    var start_pos = parseInt($('#tabs li a.current').parent().attr('id')); 
    //remove the .current class for this LI... 
    $('li#' + start_pos).children().attr('class', ''); 
    //calculate next LI ID... 
    var next_pos = (start_pos < total_lis) ? start_pos + 1: 1; 
    //add .current class to the new LI 
    $('li#' + next_pos).children().attr('class', 'current'); 
    // monitor the position of current LI, if 3th OR multiple of the total do the magix... 
    if ((start_pos == 3) || (start_pos % total_lis == 0) || (next_pos == total_lis)) { 
     $('li#' + next_pos).prevAll().andSelf().attr('class', 'faded').fadeOut(200); 
     $('li#' + next_pos).nextAll('.faded').andSelf().attr('class', '').fadeIn(200); 
    } 
    //Append some stuff recursive... 
$('#output li').fadeOut(200,function() { 
    $(this).html('<img src="http://l.yimg.com/g/images/home_photo_' + images[next_pos] + '.jpg" />' + '<a href="#">See project details</a>').fadeIn(200); 
}); 
}