您当前的位置：首页 > 阅读文章

网页设计师联盟(www.wysjs.cn)欢迎您！

标题：

表格的特殊效果，表格的边框不停的闪烁

<script language="javascript">
var line=new Array();
var w=35; // 一条边框的小格的个数（所以是个正方形啦）
var left=280; // 这个是边框在页面中的位置的左上角的X坐标
var top=10; // 自然就是纵坐啦
var width=4; // 边框中一小格的象素宽
var height=3; // 边框的高度，设为1的话就是一条细线了
line[0]="ff"+Number(25).toString(16)+Number(25).toString(16);
line[1]="ff"+Number(50).toString(16)+Number(50).toString(16);
line[2]="ff"+Number(75).toString(16)+Number(75).toString(16);
line[3]="ff"+Number(100).toString(16)+Number(100).toString(16);
line[4]="ff"+Number(125).toString(16)+Number(125).toString(16);
line[5]="ff"+Number(150).toString(16)+Number(150).toString(16);
line[6]="ff"+Number(175).toString(16)+Number(175).toString(16);
line[7]="ff"+Number(200).toString(16)+Number(200).toString(16);
line[8]="ff"+Number(225).toString(16)+Number(225).toString(16);
line[9]="ff"+Number(225).toString(16)+Number(225).toString(16);
line[10]="ff"+Number(225).toString(16)+Number(225).toString(16);
line[11]="ff"+Number(225).toString(16)+Number(225).toString(16);
line[12]="ff"+Number(200).toString(16)+Number(200).toString(16);
line[13]="ff"+Number(175).toString(16)+Number(175).toString(16);
line[14]="ff"+Number(150).toString(16)+Number(150).toString(16);
line[15]="ff"+Number(125).toString(16)+Number(125).toString(16);
line[16]="ff"+Number(100).toString(16)+Number(100).toString(16);
line[17]="ff"+Number(75).toString(16)+Number(75).toString(16);
line[18]="ff"+Number(50).toString(16)+Number(50).toString(16);
line[19]="ff"+Number(25).toString(16)+Number(25).toString(16);

function writes(num)
{
    var temp;
    var s;
    var tl,tt;
    var tw,th;
    temp=num+1;
    if(num==0)
    {
      tl = left;
      tt = top;
      tw = w*width;
      th = height;
      s="<table style='position: absolute; left: "+tl+"px; top: "+tt+"px; width: "+tw+"px; height: "+th+"px;' cellspacing='0' cellpadding='0'><tr>";
      for(r=0;r<w;r++)
      {
        temp=r+w*num;
        s+="<td id=tab"+temp+" bgcolor=red></td>";
      }
      s+="</tr></table>";
    }
    if(num==1)
    {
      tl = left+w*width;
      tt = top;
      tw = height;
      th = w*width;
      s="<table style='position: absolute; left: "+tl+"px; top: "+tt+"px; width: "+tw+"px; height: "+th+"px;' cellspacing='0' cellpadding='0'>";
      for(r=0;r<w;r++)
      {
        temp=r+w*num;
        s+="<tr><td id=tab"+temp+" bgcolor=red></td></tr>";
      }
      s+="</table>";
    }
    if(num==2)
    {
      tl = left+height;
      tt = top+w*width;
      tw = w*width;
      th = height;
      s="<table style='position: absolute; left: "+tl+"px; top: "+tt+"px; width: "+tw+"px; height: "+th+"px;' cellspacing='0' cellpadding='0'><tr>";
      for(r=w;r>0;r--)
      {
        temp=r-1+w*num;
        s+="<td id=tab"+temp+" bgcolor=red></td>";
      }
      s+="</tr></table>";
    }
    if(num==3)
    {
      tl = left;
      tt = top+height;
      tw = height;
      th = w*width;
      s="<table style='position: absolute; left: "+tl+"px; top: "+tt+"px; width: "+tw+"px; height: "+th+"px;' cellspacing='0' cellpadding='0'>";
      for(r=w;r>0;r--)
      {
        temp=r-1+w*num;
        s+="<tr><td id=tab"+temp+" bgcolor=red></td></tr>";
      }
      s+="</table>";
    }
    return s;
}
function count()
{
    var i;
    var temp;
    var total;
    total = w*4;
    for(i=0; i<line.length; i++)
    {
      temp=pos+i-line.length/2;
      temp=temp<0?(total+temp):temp;
      temp=temp>(total-1)?(temp-total):temp;
      document.all["tab"+temp].style.backgroundColor=line[line.length-i];
    }
    pos=(pos+1)>total?0:(pos+1);
}

for(i=0;i<=3;i++)
{
document.write(writes(i));
}
var pos=0;
setInterval("count()", 1);
</script>

(刊登方式：转载来源：网络作者：添加：admin 关键词：)
您已阅读：表格的特殊效果，表格的边框不停的闪烁 您还可以继续阅读↓ 或回到首页看看>>>
上一篇：按钮控制窗口移动 (功能比较丰富)
 <INPUTTYPE="TEXT"size="18"value="这是默认的内容"onfocus="if(value=='这是默认的内容'){value=''}"onblur="if(value==''){value='这是默认的内容'}">
下一篇：网页源代码加密保护输入原代码之后可以变为乱码
 <SCRIPTlanguage=javascript> <!-- varWords; functionSetWords(word) { Words=escape(word.value); } functionSetNewWords(form) { varNewWords;..