<script>
var w = $(window).width();//获取窗口宽度
var h = $(window).height();//获取窗口高度
$(".box").width(w);//赋值给图片外包
$(".box").height(h);function carousel(){
???var v1=$(".box .text");//消失的元素
???var v2;//要显示的元素
???if(v1.next().length==0){//如果循环到最后一张
???????v2 = $(".box img").eq(0);//v2显示为第一张
???}else{
???????v2 = v1.next();//否则显示下一张
???}
???v1.animate({opacity:"0"},2000,function(){
???????v1.removeClass("text");//动画效果-消失
???});
???v2.animate({opacity:"1"},2000,function(){
???????v2.addClass("text");//动画效果-显示???});
}
</script>
<html>
<div class="box">
???????<img src="img/amg_three.jpg" title="car" alt="图片未加载" class="text">
???????<img src="img/carousel_two.jpg" title="car" alt="图片未加载">
???????<img src="img/amg_four.jpg" title="car" alt="图片未加载">
???????<img src="img/carousel_four.jpg" title="car" alt="图片未加载">
</div>
</html>
JQuery图片自适应窗口轮播图（淡入淡出效果）
原文地址：http://www.cnblogs.com/ps0327/p/7588243.html