求梯度显示背景颜色的JavaScript(或许是滤镜,200分)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD><TITLE>颜色</TITLE>
<META content="text/html; charset=gb2312" http-equiv=Content-Type>
<STYLE type=text/css>
TD { FONT-SIZE: 10.8pt}
BODY { FONT-SIZE: 10.8pt}
BUTTON {WIDTH: 5em}
</STYLE><SCRIPT language=JavaScript>
var SelRGB = '';
var DrRGB = '';
var SelGRAY = '120';
var temp;
var hexch = new Array('0', '1', '2', '3', '4', '5', '6', '7', '8', '9', 'A', 'B', 'C', 'D', 'E', 'F');function ToHex(n)
{ var h, l; n = Math.round(n);
l = n % 16;
h = Math.floor((n / 16)) % 16;
return (hexch[h] + hexch[l]);
}function DoColor(c, l)
{ var r, g, b;  r = '0x' + c.substring(1, 3);
  g = '0x' + c.substring(3, 5);
  b = '0x' + c.substring(5, 7);

  if(l > 120)
  {
    l = l - 120;    r = (r * (120 - l) + 255 * l) / 120;
    g = (g * (120 - l) + 255 * l) / 120;
    b = (b * (120 - l) + 255 * l) / 120;
  }else
  {
    r = (r * l) / 120;
    g = (g * l) / 120;
    b = (b * l) / 120;
  }  return '#' + ToHex(r) + ToHex(g) + ToHex(b);
}function EndColor()
{ var i;  if(DrRGB != SelRGB)
  {
    DrRGB = SelRGB;
    for(i = 0; i <= 30; i ++)
      GrayTable.rows(i).bgColor = DoColor(SelRGB, 240 - i * 8);
  }  SelColor.value = DoColor(RGB.innerText, GRAY.innerText);
  ShowColor.bgColor = SelColor.value;
}
</SCRIPT><SCRIPT event=onclick for=ColorTable language=JavaScript>
  SelRGB = event.srcElement.bgColor;
  EndColor();
</SCRIPT><SCRIPT event=onmouseover for=ColorTable language=JavaScript>
  RGB.innerText = event.srcElement.bgColor;
  EndColor();
</SCRIPT><SCRIPT event=onmouseout for=ColorTable language=JavaScript>
  RGB.innerText = SelRGB;
  EndColor();
</SCRIPT><SCRIPT event=onclick for=GrayTable language=JavaScript>
  SelGRAY = event.srcElement.title;
  EndColor();
</SCRIPT><SCRIPT event=onmouseover for=GrayTable language=JavaScript>
  GRAY.innerText = event.srcElement.title;
  EndColor();
</SCRIPT><SCRIPT event=onmouseout for=GrayTable language=JavaScript>
  GRAY.innerText = SelGRAY;
  EndColor();
</SCRIPT><SCRIPT event=onclick for=Ok language=JavaScript>
  window.returnValue = SelColor.value;
  window.close();
</SCRIPT>
</HEAD>
<BODY bgColor=menu>
<DIV align=center>
<CENTER>
<TABLE border=0 cellPadding=0 cellSpacing=10>
  <TBODY>
  <TR>
    <TD>
      <TABLE border=0 cellPadding=0 cellSpacing=0 id=ColorTable style="CURSOR: hand">
        <SCRIPT language=JavaScript>
function wc(r, g, b, n)
{
r = ((r * 16 + r) * 3 * (15 - n) + 0x80 * n) / 15;
g = ((g * 16 + g) * 3 * (15 - n) + 0x80 * n) / 15;
b = ((b * 16 + b) * 3 * (15 - n) + 0x80 * n) / 15; document.write('<TD BGCOLOR=#' + ToHex(r) + ToHex(g) + ToHex(b) + ' height=8 width=8></TD>');
}var cnum = new Array(1, 0, 0, 1, 1, 0, 0, 1, 0, 0, 1, 1, 0, 0, 1, 1, 0, 1, 1, 0, 0);  for(i = 0; i < 16; i ++)
  {
     document.write('<TR>');
     for(j = 0; j < 30; j ++)
     {
      n1 = j % 5;
      n2 = Math.floor(j / 5) * 3;
      n3 = n2 + 3;      wc((cnum[n3] * n1 + cnum[n2] * (5 - n1)),
      (cnum[n3 + 1] * n1 + cnum[n2 + 1] * (5 - n1)),
      (cnum[n3 + 2] * n1 + cnum[n2 + 2] * (5 - n1)), i);
     }     document.writeln('</TR>');
  }
</SCRIPT>        <TBODY></TBODY></TABLE></TD>
    <TD>
      <TABLE border=0 cellPadding=0 cellSpacing=0 id=GrayTable
      style="CURSOR: hand">
        <SCRIPT language=JavaScript>
  for(i = 255; i >= 0; i -= 8.5)
     document.write('<TR BGCOLOR=#' + ToHex(i) + ToHex(i) + ToHex(i) + '><TD TITLE=' + Math.floor(i * 16 / 17) + ' height=4 width=20></TD></TR>');
</SCRIPT><TBODY></TBODY></TABLE></TD></TR></TBODY></TABLE></CENTER></DIV>
<DIV align=center>
<CENTER>
<TABLE border=0 cellPadding=0 cellSpacing=10>
  <TBODY>
  <TR>
    <TD align=middle rowSpan=2>选中色彩
      <TABLE border=1 cellPadding=0 cellSpacing=0 height=30 id=ShowColor
      width=40>
        <TBODY>
        <TR>
          <TD></TD></TR></TBODY></TABLE></TD>
    <TD rowSpan=2>基色: <SPAN id=RGB></SPAN><BR>亮度: <SPAN
      id=GRAY>120</SPAN><BR>代码: <INPUT id=SelColor size=7></TD>
    <TD><BUTTON id=Ok type=button>确定</BUTTON></TD></TR>
  <TR>
    <TD><BUTTON onclick=window.close();>取消</BUTTON></TD></TR></TBODY></TABLE></CENTER></DIV></BODY></HTML>

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

还是一个单元格一种颜色呀，无法渐变，应该像Windows 98的标题条一样，而且应该可以设定起始颜色和终止颜色
<DIV STYLE="position:absolute; top:50px; left:10px; width:240px; height:160px; padding:10px; font:bold 11pt verdana;">
    This text is positioned behind the filtered DIV.
</DIV>
<DIV ID="oFilterDIV" STYLE="position:absolute; top:50px; left:10px; width:240px; height:160px; padding:10px; font:bold 13pt verdana; color:white;
filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=1, StartColorStr='#800000FF', EndColorStr='#80FFCC00')">
<BR/><BR/><BR/>This is the DIV content.</DIV>
<HTML>
<HEAD>
<TITLE>Gradient Filter Sample</TITLE>
<LINK REL="stylesheet" HREF="/workshop/samples/samples.css" TYPE="text/css">
</HEAD><BODY TOPMARGIN=0 LEFTMARGIN=0 BGPROPERTIES="FIXED" LINK="#000000" VLINK="#808080" ALINK="#000000">
<BLOCKQUOTE CLASS="body">
<h2>Using the Gradient Filter</h2>
Click on the following button to apply a <b>Gradient</b> filter to the <b>DIV</b>.
<p>
<SCRIPT>
function fnToggle(oObj) {
    if (oDiv.filters(0).enabled){
        oDiv.filters(0).enabled='false';
        oObj.innerText='Add Gradient';}
    else {
        oDiv.filters(0).enabled='true';
        oObj.innerText='Make Normal';}
}
</SCRIPT><font size="+5">
    <DIV ID="oDiv" STYLE="height:120px; color:green; filter:
            progid:DXImageTransform.Microsoft.gradient(enabled='false',
                startColorstr=#550000FF, endColorstr=#55FFFF00)" >
        A simple gradient
    </DIV>
</font>
<P>
<BUTTON onclick="fnToggle(this)">Add Gradient</BUTTON><BR/>
<br><br><br>
© <A CLASS="clsIncCpyRt" HREF="http://www.microsoft.com/isapi/gomscom.asp?TARGET=/misc/info/cpyright.htm" TARGET="_top">2001 Microsoft Corporation. All rights reserved. Terms of use</A>.
</BLOCKQUOTE></BODY>
</HTML>