var t;
var fade_time=1000;
var delay=4000;

loadImages = function(index) {
	img = new Image();
	$(img).load(function () {
		//$('#imageContainer'+index).css('display', 'none'); // .hide() doesn't work in Safari when the element isn't on the DOM already
		$('#imageContainer'+index).hide();
		$('#imageContainer'+index)
		// while (!$('#imageContainer'+index+' img').length) $('#imageContainer'+index).append(this);
		$('#imageContainer'+index).append(this);
		if (index==1) {
			$('#imageContainer'+index).fadeIn(200);
			t=setTimeout('nextImage(1)', delay);
		}
		if (index<iNumberOfThumbnails) loadImages(index+1);
	}).error(function () {
		// notify the user that the image could not be loaded
	}).attr('src', images[index][0]).css('position', 'relative').css('z-index', '1');
};	

nextImage = function (index) {
	nextIndex = index==iNumberOfThumbnails ? 1 : index+1;
	$('#imageContainer'+index).fadeOut(fade_time);
	$('#imageContainer'+nextIndex).fadeIn(fade_time);
	t=setTimeout('nextImage(nextIndex)', delay);
};	

loadImages(1);