function bannerFader()
{
	var frame = null;
	var height = null;
	var width = null;
	
	var front = 1;
	var back = 2;
}

bannerFader.prototype.run = function()
{
	var nextitem = 3;
	var data = $(this.frame).html();
	$(this.frame).html('<div class="rotator front" ident="1"></div>');
	$(this.frame).append('<div class="rotator back" ident="2"></div>');
	$(this.frame).append(data);
	
	var data = $(this.frame).find('.data');
	var frontframe = $(this.frame).find('.rotator[ident=1]');
	var backframe = $(this.frame).find('.rotator[ident=2]');
	
	var i = 1;
	$(this.frame).find('.item').each(function(){
		$(this).attr({ident: i});
		i++;
	});
	
	$(data).hide();
	$(data).find('.overlay').hide();
	
	// move first image into front frame
	var frontdata = $(data).find('.item[ident=1]').html();
	$(frontframe).html(frontdata);
	
	// move second image into back frame
	var backdata = $(data).find('.item[ident=2]').html();
	$(backframe).html(backdata);
	
	$('.rotator.front .overlay').fadeIn(3000);
	
	setInterval(function(){
		// fade out front image
		$(frontframe).fadeOut(3000, function(){
			// move back image to front
			$(frontframe).html(backdata).show();
			
			// fade in overlay
			$('.rotator.front .overlay').fadeIn(3000);
			
			// determine next image
			if(nextitem + 1 <= $(data).find('.item').length)
			{
				nextitem++;
			} else {
				nextitem = 1;
			}
			
			// change back image
			backdata = $(data).find('.item[ident="'+nextitem+'"]').clone();
			$(backframe).html(backdata);
			
			// hide its overlay
			$(backframe).find('.overlay').hide();
		});
	}, 8000);
}