var delay = 5000;
var rotators = new Array(
	'images/header1.jpg',
	'images/header2.jpg',
	'images/header3.jpg',
	'images/header4.jpg'
);
Event.observe(window, 'load', function(){
		setTimeout('changeImage();', delay);
});
function changeImage() {
	// first we set the background image of the .headerphoto div to the new image 0
	$('logo').style.backgroundImage='url(' + rotators[0] + ')';
	// now fade out the image
	$('headerimg').fade();
	// change the image source
	$('headerimg').src = rotators[0];
	// and show it
	$('headerimg').show();
	// and change the background image to the next one to preload it
	$('logo').style.backgroundImage='url(' + rotators[1] + ')';
	img = rotators.shift();
	rotators[rotators.length] = img;
	setTimeout('changeImage();', delay);
}