var currentImage;
    var currentIndex = -1;
    var interval;
	var myTimer;
    function showImage(index){
        if(index < $('#bigPic img').length){
        	var indexImage = $('#bigPic img')[index]
            if(currentImage){   
            	if(currentImage != indexImage ){
                    $(currentImage).css('z-index',1);
                    clearTimeout(myTimer);
					$(indexImage).css('opacity', 0.0);
					$(indexImage).css('z-index', 1);
                    $(indexImage).css('left', '180px');					
					$(indexImage).animate({
						left: "0",
						opacity: 1.0
					  }, 1000, 'easeInOutSine' );					
					$(currentImage).fadeOut(1300, function() {
					    myTimer = setTimeout("showNext()", 5000);
					    $(this).css({'display':'none','z-index':1})
					});
                }
            }
            $(indexImage).css({'display':'block', 'opacity':1});
            currentImage = indexImage;
            currentIndex = index;
            $('#thumbs li').removeClass('active');
            $($('#thumbs li')[index]).addClass('active');
        }
    }
    
    function showNext(){
        var len = $('#bigPic img').length;
        var next = currentIndex < (len-1) ? currentIndex + 1 : 0;
        showImage(next);
    }
    
	function startSlideImage(){
		 myTimer = setTimeout("showNext()", 5000);
		showNext(); //loads first image
	}