// hide all but the first image when page loads
$(document).ready(function() {
    $('#fader img:gt(0)').hide();
});

	// wait until images have loaded before starting cycle
$(window).load(function() {
	// front image rotator
	$('#fader').cycle({
		fx:     'fade',
		timeout:  4000,
		delay:   -2000,
        before: onBefore
	});
});


// callback fired when each slide transition begins
function onBefore(curr,next,opts) {
    var $slide = $(next);
    var w = $slide.outerWidth();
    var h = $slide.outerHeight();
    $slide.css({
        marginTop: (400 - h) / 2,
        marginLeft: (480 - w) / 2
    });
};