window.setInterval()方法可不仅仅帮我们做一个定时器这么简单,可以利用它实现很多好玩有用的特效。
PS:
其实可以看出,图片并不是背景图片,只是利用了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)"></div></body><script type="text/javascript">var img=document.getElementById("cz");var i=0;var i_incr=5;function tmd(){if(i<=-5){i_incr=5;}if(i>=105){i_incr=-5;}i+=i_incr;img.style.filter="alpha(opacity="+i+")";}var timer;startBh();function startBh(){timer=window.setInterval("tmd()",100)}</script>
</html>