$(function(){ 
    var shown = 1; 
    $('#1').css('opacity','1').css('filter','alpha(opacity=100)'); 
    var left = -376; 
    var ap = 2;
    function autoplay(){
        $('#port'+shown).animate({'height' : '0px'} , 1000).css('z-index','3');
        $('#port'+ap).animate({'height' : '380px'} , 1000).css('z-index','3');
        $('#'+ap).css('opacity','1').css('filter','alpha(opacity=100)');
        $('#'+shown).css('opacity','0.7').css('filter','alpha(opacity=70)');
        shown = ap;
        ap ++;
        if(ap > 4) ap = 1;
    } 
    
    var inter = setInterval(autoplay , 6000);
    
    
    $('.siteimage').click(function(){
        var i = parseInt($(this).attr('id'));
        $('#port'+shown).animate({'height' : '0px'} , 1000).css('z-index','3');
        $('#port'+i).animate({'height' : '380px'} , 1000).css('z-index','3');
        $('#'+i).css('opacity','1').css('filter','alpha(opacity=100)');
        $('#'+shown).css('opacity','0.7').css('filter','alpha(opacity=70)');
        shown = i;
        clearInterval(inter);
        return false;
    });
    
    $('.portnext').click(function(){
        if(left == 0){
            $('#portfolioslide').animate({'left':'-376px'},'slow');
            left = -376;
        }else{
            $('#portfolioslide').animate({'left':'+=94px'},'slow');
            left +=94;        
        }
        clearInterval(inter);
        return false;
    });
    $('.portback').click(function(){
        if(left == -376){
            $('#portfolioslide').animate({'left':'0px'},'slow');
            left = 0;
        }else{
            $('#portfolioslide').animate({'left':'-=94px'},'slow');
            left -=94;        
        }
        clearInterval(inter);
        return false;
    });
       
});