test.htm
<html>
<HEAD>
<TITLE>行为效果演示</TITLE>
<STYLE>
.myfilter{
behavior:url(font_effect.htc);
position:relative;
font-weight:bold;
width=180;
left:0;
}
</STYLE>
</HEAD>
<BODY>
<span id="myspan" class='myfilter'>行为产生的文字效果</span><br>
<span class='myfilter'>鼠标指向后产生辉光</span><br>
<span class='myfilter'>同时文字变白</span><br>
<span class='myfilter'>按下鼠标后文字变黄</span><br>
<span class='myfilter'>抬起鼠标后文字变蓝</span><br>
<span class='myfilter'>鼠标离开后文字恢复原状</span><br>
<button onclick="myspan.move_right();">向右移动第一行文字</button><br>
<button onclick="myspan.move_down();">向下移动第一行文字</button>
</BODY>
</html> 回复
# re: htc入门 2005-04-12 10:54 青苹果
font_effect.htc
<PUBLIC:ATTACH EVENT="onmouseover" ONEVENT="glowit()" />
<PUBLIC:ATTACH EVENT="onmouseout" ONEVENT="noglow()" />
<PUBLIC:ATTACH EVENT="onmousedown" ONEVENT="font2yellow()" />
<PUBLIC:ATTACH EVENT="onmouseup" ONEVENT="font2blue()" />
<PUBLIC:METHOD NAME="move_down" />
<PUBLIC:METHOD NAME="move_right" />
<SCRIPT LANGUAGE="JScript">
//定义一个保存字体颜色的变量
var font_color;
//定义向下移动文字的方法
function move_down()
{
element.style.posTop+=2;
}
//定义向右移动文字的方法
function move_right()
{
element.style.posLeft +=6;
}
//定义鼠标onmouseup事件的调用函数
function font2blue(){
if (event.srcElement == element)
{
element.style.color='blue';
}
}
//定义鼠标onmousedown事件的调用函数
function font2yellow(){
if (event.srcElement == element)
{
element.style.color='yellow';
}
}
//定义鼠标onmouseover事件的调用函数
function glowit()
{
if (event.srcElement == element)
{
font_color=style.color;
element.style.color='white';
element.style.filter="glow(color=red,strength=2)";
}
}
//定义鼠标onmouseout事件的调用函数
function noglow()
{
if (event.srcElement == element)
{
element.style.filter="";
element.style.color=font_color;
}
}
</SCRIPT>