<div id="topImages">

	<div class="slide-img"><img src="/images/home1.jpg" width="2298" height="438" /></div>
    <div class="slide-img"><img src="/images/home2.jpg" width="2298" height="438" /></div>

</div>


<script type="text/javascript">

$(document).ready(function() {
	
	$('#topImages').cycle({
		fx:'fade',
		sync: 1,
		speed:1000,
		timeout: 3000
	});
	
});

$(window).resize(function(){

function centerImages(){
      var imgW=2298;
      var mainW= $('#topImages').width();

      var margL=0-(imgW-mainW)/2;
      $('.slide-img img').css('marginLeft',margL);
}

centerImages();

});

$(window).resize();


</script>

cycle 100% centered images

JavaScript