$(function(){
    indexSlider();
    
})

function indexSlider(){
    var totals=$('.indexSlider img').length;
    var current=0;
    
    var distance=$('.indexSlider img:eq(0)').width();
    
    var frequency=5000;
    
    var intervalId=setInterval(autoImages,frequency);
    var timeId;
    
    //Éú³É·Öí“
    var navi='<div class="indexPage">';
    
    for(var i=0; i<totals; i++){
        navi+='<a href="#'+i+'" id="page_'+i+'">'+(i+1)+'</a>';
    }
    navi+='</div>';
    $('.indexWrapper').before(navi);
    
    
    
    $('.indexPage a:eq(0)').addClass('current');
    $('.indexPage a').live('click',function(){
        var id=$(this).attr('href');
        id=id.slice(id.indexOf('#')+1);
        moveImages(id);
        current=id;
        $('.indexPage a').removeClass('current');
        $(this).addClass('current');
        
        
        clearInterval(intervalId);
        clearTimeout(timeId);
        timeId=setTimeout(reAutoImages,frequency*2);        
        
        return false;
    })
    
    
    
    function moveImages(page){
        
        $('.indexWrapper').animate({
            'left':-page*distance
        })
        $('.indexPage a').removeClass('current');
        $('.indexPage a:eq('+page+')').addClass('current');

        
    }
    
    function autoImages(){
        current++;
        if(current>totals-1){
            current=0;
        }
        moveImages(current);
    }
    
    function reAutoImages(){
        intervalId=setInterval(autoImages,frequency);
    }

    
    

    
    
}