和上一个发的文章一样，同样是利用setInterval()定时器，可以实现图片淡入淡出，图片变换等等特效。
其实可以看出，图片并不是背景图片，只是利用了DIV中position: absolute;z-index:6px这个属性让这个DIV不是处在第0层的位置，效果就好像是背景图片一样。
图片的淡入淡出，其实是用到了滤镜filter:alpha(opacity=0);这个这个属性。opacity是设置透明度的。滤镜filter下还有一个shadow，用来显示阴影的。
大家以后多用用这几个属性，说不定会有很好的效果。
应该还能实现很多其他的特效，有兴趣的话可以自己做一个，到时候记得发给我。
代码如下：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html><head><title>bgout.html</title><meta http-equiv="keywords" content="keyword1,keyword2,keyword3"><meta http-equiv="description" content="this is my page"><meta http-equiv="content-type" content="text/html; charset=UTF-8"><!--<link rel="stylesheet" type="text/css" href="./styles.css">--></head><body leftmargin="0px" topmargin="0px"> <div style="position: absolute;z-index:6px;width: 1366px;text-align: right"><img id="cz" alt="" src="bg.jpg" style="width: 1366px;height: 968px;filter:alpha(opacity=0);display: 'none'"></div></body><script type="text/javascript">var img=document.getElementById("cz");var allImg=new Array("bg.jpg","bg2.jpg","bg3.jpg");var index=0;img.style.filter="alpha(opacity=0)";var i=0;var i_incr=5;function tmd(){if(i<-5){i_incr=5;}if(i>=125){i_incr=-5;}changeBg();}var timer;startBh();function startBh(){img.style.display='block';timer=window.setInterval("tmd()",100)}function changeBg(){i+=i_incr;if(i<-5){index++;if(index>2){index=0;}img.src=allImg[index];}img.style.filter="alpha(opacity="+i+")";}</script>
</html>