图片及文字的多种滤镜效果

<STYLE>
P.a0 {
 COLOR: maroon; FONT-FAMILY: 宋体, 'Times New Roman'; FONT-SIZE: 10.5pt; LINE-HEIGHT: 150%; MARGIN: 0cm 0cm 0pt; TEXT-ALIGN: justify; TEXT-JUSTIFY: inter-ideograph
}
P.REM {
 COLOR: green
}
P.indent2 {
 FONT-FAMILY: "Times New Roman",'宋体'; FONT-SIZE: 9pt; TEXT-INDENT: 40pt
}
IMG {
 BORDER-BOTTOM: 0px; BORDER-LEFT: 0px; BORDER-RIGHT: 0px; BORDER-TOP: 0px
}
TD {
 FONT-FAMILY: 宋体,Verdana, Helvetica, Arial, sans-serif; FONT-SIZE: 9pt
}
TH {
 FONT-FAMILY: Verdana, Helvetica, Arial, sans-serif; FONT-SIZE: 12pt
}
TH.date {
 FONT-FAMILY: Verdana, Helvetica, Arial, sans-serif; FONT-SIZE: 9pt
}
H1 {
 FONT-FAMILY: "Times New Roman"; FONT-SIZE: 22pt; MARGIN: 30pt 0cm 20pt; PAGE-BREAK-BEFORE: always; TEXT-ALIGN: center; TEXT-INDENT: 0cm
}
H2 {
 FONT-FAMILY: "Times New Roman"; FONT-SIZE: 14pt; LINE-HEIGHT: 18pt; MARGIN: 6pt 0cm; TEXT-ALIGN: justify; TEXT-INDENT: 0cm; TEXT-JUSTIFY: inter-ideograph
}
H3 {
 FONT-FAMILY: "Times New Roman"; FONT-SIZE: 12pt; LINE-HEIGHT: 18pt; MARGIN: 6pt 0cm; TEXT-ALIGN: justify; TEXT-INDENT: 0cm; TEXT-JUSTIFY: inter-ideograph
}
H4 {
 FONT-FAMILY: "Times New Roman"; FONT-SIZE: 10.5pt; LINE-HEIGHT: 18pt; MARGIN: 0cm 0cm 0pt 14.2pt; TEXT-ALIGN: justify; TEXT-INDENT: -14.2pt; TEXT-JUSTIFY: inter-ideograph
}
H5 {
 FONT-FAMILY: "Times New Roman"; FONT-SIZE: 10.5pt; FONT-WEIGHT: normal; LINE-HEIGHT: 18pt; MARGIN: 0cm 0cm 0pt; TEXT-ALIGN: justify; TEXT-INDENT: 0cm; TEXT-JUSTIFY: inter-ideograph
}
A {
 COLOR: darkgreen; FONT-SIZE: 9pt; FONT-STYLE: normal; FONT-WEIGHT: normal; TEXT-DECORATION: none
}
A.English {
 COLOR: darkgreen; FONT-FAMILY: Verdana, Helvetica, Arial, sans-serif; FONT-SIZE: 9pt; FONT-STYLE: normal; FONT-WEIGHT: normal; TEXT-DECORATION: none
}
A:visited {
 FONT-SIZE: 9pt; FONT-STYLE: normal; FONT-WEIGHT: normal; TEXT-DECORATION: none
}
A:active {
 COLOR: red; FONT-SIZE: 9pt; FONT-STYLE: normal; FONT-WEIGHT: normal; TEXT-DECORATION: none
}
A:hover {
 COLOR: #ff3300; FONT-STYLE: normal; FONT-WEIGHT: normal; TEXT-DECORATION: underline
}
.ahead {
 MARGIN-BOTTOM: 4px
}
.bhead {
 MARGIN-BOTTOM: 2px; MARGIN-LEFT: 5px
}
.chead {
 MARGIN-BOTTOM: 2px; MARGIN-LEFT: 15px
}
.dhead {
 MARGIN-BOTTOM: 2px; MARGIN-LEFT: 15px
}
.ehead {
 MARGIN-BOTTOM: 2px; MARGIN-LEFT: 20px
}
.showDIV {
 DISPLAY: block
}
.hideDIV {
 DISPLAY: none
}
DIV.shadowfilter {
 FILTER: shadow(Color="#6699CC", Direction="135")
}
DIV.GlowFilter {
 FILTER: Glow(Color="#ff0000",Strength="5")
}
IMG.alpha {
 FILTER: alpha(opacity=40)
}
IMG.gray {
 FILTER: gray
}
IMG.xray {
 FILTER: xray
}
TD {
 FONT-FAMILY: arial,time roman new; FONT-SIZE: 12pt
}
</STYLE>
<SCRIPT language=javascript>
function setalpha(statutext,rate)
{
//设置alpha通道
//statutext:状态栏文字
window.status=statutext;
window.event.srcElement.style.filter ="Alpha(Opacity="+ rate +")";
}

function setxray(statutext,flag)
{
//设置灰度
//statutext:状态栏文字
window.status=statutext;
if (flag)
 window.event.srcElement.style.filter ="xray"
else
 window.event.srcElement.style.filter ="";
}

function setchroma(statutext,rgb)
{
//statutext:状态栏文字
//rgb:欲透明的颜色值
window.status=statutext;
window.event.srcElement.style.filter ="Chroma(Color="+rgb+")";
}

function setgray(statutext,flag)
{
//设置灰度
//statutext:状态栏文字
window.status=statutext;
if (flag)
 window.event.srcElement.style.filter ="gray"
else
 window.event.srcElement.style.filter ="";
}

function setglow(statutext,rgb,flag)
{
//statutext:状态栏文字
//只适用于DIV，其width属性必不可少
//rgb:阴影颜色值,flag：阴影角度
window.status=statutext;
if (flag==-1)
 window.event.srcElement.style.filter =""
else
 window.event.srcElement.style.filter ="Glow(Color='"+rgb+"',Strength="+flag+")";
}

function setshadow(statutext,rgb,flag)
{
//statutext:状态栏文字
//只适用于DIV，其width属性必不可少
//rgb:阴影颜色值,flag：阴影角度
window.status=statutext;
if (flag==-1)
 window.event.srcElement.style.filter =""
else
 window.event.srcElement.style.filter ="shadow(Color='"+rgb+"',direction='"+flag+"')";
}

</SCRIPT>
<TABLE align=center border=0 cellPadding=0 cellSpacing=0 width="60%">
  <TBODY>
  <TR>
    <TD align=middle><IMG class=alpha height=177 id=testalpha
      onmouseout="setalpha('Alpha=40',40)"
      onmouseover="setalpha('Alpha=100',100)" src="photo/logo1205.jpg"
    width=152></TD>
    <TD align=middle><IMG class=xray height=177 id=testxray
      onmouseout="setxray('Xray=1',1)" onmouseover="setxray('Xray=0',0)"
      src="photologo1205.jpg" width=152></TD></TR>
  <TR>
    <TH align=middle height=30 style="HEIGHT: 30px">Alpha</TH>
    <TH align=middle>Xray</TH></TR>
  <TR>
    <TD align=middle><IMG height=177 id=testchroma
      onmouseout="setchroma('Chroma=#000000','#000000')"
      onmouseover="setchroma('Chroma=#FFFFFF','#ffffff')"
      src="photologo1205.jpg" width=152></TD>
    <TD align=middle><IMG class=gray height=177 id=testgray
      onmouseout="setgray('Gray=1',1)" onmouseover="setgray('Gray=0',0)"
      src="photologo1205.jpg" width=152></TD></TR>
  <TR>
    <TH height=30 style="HEIGHT: 30px">Chroma</TH>
    <TH>Gray</TH></TR>
  <TR>
    <TD align=middle>
      <DIV id=testglow onmouseout="setglow('Glow=#00FF00','#00ff00',-1)"
      onmouseover="setglow('Glow=#00FF00','#00ff00',3)"
      style="COLOR: #336699; FONT: bold 20pt 'Verdana'; HEIGHT: 32px; WIDTH: 153px">Glow
      Text</DIV></TD>
    <TD align=middle height=62 style="HEIGHT: 62px">
      <DIV id=testshadow onmouseout="setshadow('Shadow=#0000FF','#0000ff',-1)"
      onmouseover="setshadow('Shadow=#FF0000','#ff0000',45)"
      style="COLOR: #336699; FONT: bold 20pt 'Verdana'; WIDTH: 200px">Shadow
      Text</DIV></TD></TR>
 </TBODY></TABLE>