Using the awesome carouFredSel, I’ve integrated it into a full screen carousel, so it scrolls the whole width and height of your browser window, if the body height is shorter than your browser height, the browser height will take precendence and vice versa.

Credit for the carousel goes to carouFredSel, I merely made it work to provide a fullscreen width and height solution into a plugin. You will need to get the carouFredSel Plugin and the jQuery Easing Plugin. It currently works with the latest carouFredSel plugin which is 5.1.3 as of posting, and probably will work with revised versions. This plugin has been tested in Latest Chrome, FireFox and Safari, IE 7,8 & 9. Please use the latest jQuery Release too.

Script Header:

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script type="text/javascript" src="jquery.easing.1.3.js"></script>
<script type="text/javascript" src="jquery.carouFredSel-5.1.3-packed.js"></script>
<script type="text/javascript" src="jquery.fsCarousel.1.0.js"></script>

Script Initialisation:

<script type="text/javascript">
$(function(){
	$('#background-slides').fsCarousel();
});
</script>

Defaults:

	var defaults = {
		slideClass: '.slide', //the class name for your slides
		scrollEasing: 'easeInOutQuint', //easing method
		scrollPauseDuration: 5000, //pause duration of slide
		scrollDuration: 500, //duration of a scroll
		autoPlay: true
	};

CSS:

<style type="text/css">

	* {margin:0; padding:0}
	body {background: #ccc; color:#fff; margin:20px; font-family:Arial, Helvetica, sans-serif; font-size:11px}
	a {color:#fff}

	/* Background Carousel */
	#background-slides {position:absolute; top:0px; left:0px}
	.slide {float:left}

	.slide.redbg {background:red}
	.slide.orangebg {background:orange}
	.slide.greenbg {background:green}

	#container {width:950px; margin:0 auto; height:1500px; background:#fff; position:relative}

</style>

HTML:

	<div id="background-slides">
		<div class="slide redbg">1</div>
		<div class="slide orangebg">2</div>
		<div class="slide greenbg">3</div>
	</div>

	<div id="container">Content Container</div>

Download Plugin and Source Files: jquery.fsCarousel.1.0

View the Demo