本实例演示如何在网页上输出水波纹形状的文本。
向网页上添加一个DIV图层，代码如下所示：
<DIV id="oFilterDIV"
style="position:relative; width:260; height:50;
filter:wave(Add=0,Freq=5,LightStrength=10,Phase=1,Strength=3)">
<P>
<FONT color="#FF0000" size=30>
问君能有几多愁，恰似一江春水向东流。
</FONT>
</P>
</DIV>
图层的id为oFilterDIV，然后把图层的style属性中的filter设置为wave，并且在图层中显示文本“问君能有几多愁，恰似一江春水向东流。”。
添加自定义函数chwave，在其中检测oFilterDIV图层wave特效的Strength属性，如果属性值为2，那么就更改为3，否则设置为2：
function chwave()
{
if(oFilterDIV.filters.item("wave").Strength==2)
{
oFilterDIV.filters.item("wave").Strength=3;
}
else
{
oFilterDIV.filters.item("wave").Strength=2;
}
}
添加语句setInterval("chwave()",200)后，每隔200毫秒就会自动执行chwave函数。
<HTML>
<HEAD>
<META name="GENERATOR" content=“Microsoft Visual Studio 6.0">
<TITLE></TITLE>
</HEAD>
<BODY>
<P> </P>
<SCRIPT language=javascript>
function chwave()
{
if(oFilterDIV.filters.item("wave").Strength==2)
{
oFilterDIV.filters.item("wave").Strength=3;
}
else
{
oFilterDIV.filters.item("wave").Strength=2;
}
}
setInterval("chwave()",200);
</SCRIPT>
<DIV id="oFilterDIV"
style="position:relative; width:260; height:50;
filter:wave(Add=0,Freq=5,LightStrength=10,Phase=1,Strength=3)">
<P>
<FONT color="#FF0000" size=30>
问君能有几多愁，恰似一江春水向东流。
</FONT>
</P>
</DIV>
</BODY>
</HTML>
保存文件，在浏览器中浏览网页文件，网页上的文本就会不停地扭动，结果如图1-12所示。
图1-12 不停扭动的文本
E- mail:
本站ICP备案号：
