Here is a little script I created when making a site for a client.

Sometimes these simple fadeout slideshows are hard to find from my own experience.



Code:
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>Slideshow</title>
<script src="jquery.js"></script>
<style type="text/css">

#slideshow{
	position: relative;
	width: 800px;
	height: 600px;
	overflow: hidden;
}	
#slideshow img{
	
	display: block;
	top: 0px;
	left: 0px;
}
</style>
</head>

<body>
<div id='slideshow'>
	<img src="pic1.gif" />
    <img src="pic2.gif" />
    <img src="pic3.jpg" />
    <img src="pic4.jpg" />
	
</div>
<script>


function slideshow(){
	$('#slideshow img:first-child').css('position','absolute');
	$('#slideshow img:first-child').fadeOut(function(){
		$('#slideshow img:first-child').insertAfter('#slideshow img:last-child');	
		
		$('#slideshow img:last-child').css('position','static');
	});
	$('#slideshow img:nth-child(2)').fadeIn();
}


				
	setInterval('slideshow()', 5000);

	
	
	</script>

</body>
</html>