﻿$( function(){


    var nrOfPictures=4;
	
	var oldPicNr=0;
	var newPicNr=0;
	var rotatorElements={};


    function picRotator(){
	
        $fadeOutEl=rotatorElements[oldPicNr];
        
		newPicNr = (oldPicNr + 1) % nrOfPictures;
		
		$fadeInEl=rotatorElements[newPicNr];
		
		$fadeOutEl.animate({opacity:"0"},3000);
		$fadeInEl.animate({opacity:"1"},3000);
		
		oldPicNr=newPicNr;
  
    };



    var picRotatorCss = {
	  'height': 348, 
	  'margin': '0 auto',
	  'position':'relative',
	  'width': 460
	}

    $("h2+img").remove();
    $("p+h2").after("<div class='picRotator'></div>");
	$(".picRotator").css(picRotatorCss);
	for (var i=1;i<=nrOfPictures;i++){   
	   rotatorElements[i-1]=$("<img src='./Grafika/budynekPrzedszkola"+i+".jpg' width='450' height='338' />").addClass("building").css({'position':'absolute','opacity':0}).appendTo(".picRotator"); 
	}
	
	$(rotatorElements[0]).css("opacity",1);
	
	
    setInterval(picRotator,9000);

  }
  
  
  
  
);

