背景色淡入淡出的表格

 

<script language="JavaScript">
<!--
var step = 1; //步长
function show(obj) {
  if ((obj.filters.alpha.opacity+step>=100)||(obj.filters.alpha.opacity+step<5)) step=-step;
obj.filters.alpha.opacity+=step;
}
setInterval ("show(me)",100);
//-->
</script>表格代码：
<table border=1 cellpadding=0 cellspacing=0 id="me"style="width:80%;height:150;filter:alpha(opacity=50);" bgcolor=red>
<tr>
<td></td>
</tr>
</table>

 



代码分析：

  函数 show(obj) 中，我们实际上使用了 CSS 的 alpha 滤镜来实现对被修饰对象的颜色的淡入淡出变化。对象的透明度在递加（obj.filters.alpha.opacity+=step;）,如果递加到100或当透明度少于5时令透明度值返回步长（step）的相反数（step=-step;），这样，透明度值在5到100之间（可能更改）来回变化，从而得到淡入淡出的结果。

  函数产生的效果由 setInterval(参数1，参数1) 控制频率。setInterval（）和setTimeout()的结构一致，第一个参数为“事件”，第二个参数为间隔时间（单位为毫秒），setInterval ("show(me)",100);中，show(me)就是事件，me为被修饰对象的id标识。

  我们自定义的函数 show(obj) 要在被修饰的对象中产生作用，该对象必须有id标识，且该标识一定与setInterval里的标识一致（同时请注意，该id在整个网页代码中是唯一的）。凡有id标识的HTML标签所对应的对象都会产生函数所定义的效果（比如文本前景色、图片、表格、body的背景色等）。当然，我们这个函数使用了CSS的alpha滤镜，所以本节函数所修饰的对象必须够被alpha修饰（否则没有意义），同时该对象必须有alpha的初始值（详情请查看演示效果中颜色深浅变化着的表格里的代码）。