$(document).ready(function(){
	var delay = 5000, // 5 second delay
		rotator = $("#imgRotator"); // cached rotator
	rotator.children().first().show();
	// function to show an image
	function showImg(img) {
		return $(img).fadeIn();
	}
	// function to hide an image
	function hideImg(img) {
		return $(img).fadeOut();
	}
	// function that causes the images to rotate
	function rotate(){
    	var currImg = rotator.children(':visible'), // get curent image
			// get next image
			nextImg = currImg.next().length ? currImg.next() : rotator.children(':first'),
			// hide current image
			currPromise = hideImg(currImg),
			// show next image
			nextPromise = showImg(nextImg);
			// when both animations are done, setTimeout and re-execute rotate()
			$.when(currPromise,nextPromise).done(function(){
				setTimeout(rotate,delay);
			});
	};
	// start rotation
	setTimeout(rotate,delay);
});