| 定义的“id”标记就作为元件的对象名称,用“myspan.move_down”来调用“方法”,操纵这个对象。可以看到,在按下相应的按钮后,会使第一行的文字产生向下或向右的移动。虽然只是用第一行文字做了示范,实际上,只要做相应的设置,你也可以移动其它对象。页面源文档的完整内内容如下:
< 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 >
通过以上的简单介绍,可以看出,我们很容易地在一个“行为”中同时组合了多种文字变化效果,通过简单的“样式”设置,任意地将它与页面元件相关连,体现了“行为”组件的优点和强大功能。一个“行为”组件,不仅能在一个页面内重复使用,也可供同一站点上的所有页面使用。试想一下,如果不使用“行为”来完成上述的效果,虽然可以在页面内调用一组预定的函数来完成同样的功能,但页面内每一个使用文字效果的元件都要附加四个鼠标事件,如果在多个页面内使用相同的效果,被调用的函数也需要在每一个页面内重复设置。相比之下,孰优孰劣是很明显的。所以,使用“行为”组件,可以制作出简洁、高效、通用和便于维护的页面。本文的举例只是为了说明“行为”组件的编写和使用过程,使读者对“行为”编程有一个概括的了解,并以此基础制作出自己所需要的“行为”组件,或直接引用满足个人需要的现成“行为”组件,因为“组件共享”的概念也是“行为”开发者的初衷。最后,愿本文能起到“抛砖引玉”的目的,使读者步入精彩的DHTML网页编程天地。
上一页 [1] [2] [3] [4] |