banner淡出效果

<div class="banner">
		<div class="ban"></div>
		<ul class="ban_bar">
			<li><a href="" img="images/banner.jpg"><img src="images/banner_dadian.png" alt=""></a></li>
			<li><a href="" img="images/banner2.jpg"><img src="images/banner_xiaodian.png" alt=""></a></li>
			<li><a href="" img="images/banner3.jpg"><img src="images/banner_xiaodian.png" alt=""></a></li>
			<li><a href="" img="images/banner4.jpg"><img src="images/banner_xiaodian.png" alt=""></a></li>
		</ul>
	</div>

function banner_start(){

	function changeImg(){
		var strPath = arguments[0];
		$(".banner").css("background","url("+ strPath +") center");

		$(".banner .ban").fadeOut("slow",function(){
			$(".banner .ban").css("background","url("+ strPath +") center");
			$(".banner .ban").show();
		});
	}
	$(".banner li a").click(function(){
		changeImg($(this).attr("img"));
		$(".banner li a img").attr("src","images/banner_xiaodian.png");
		$(this).find("img").attr("src","images/banner_dadian.png");
		return false;
	});

	var i = 1;
	setInterval(function(){
		$(".banner li a")[i].click();
		i++;
		i = i % 4;
	},2000);
	$(".banner li a")[0].click();
}

banner淡出效果

原文：http://www.cnblogs.com/wanghongxu/p/3974999.html